02.Egg.js教程-Egg.js项目结构介绍

目录
文章目录隐藏
  1. Egg 的目录
  2. dev 和 start 的区别
  3. 尝试创建一个新的页面

本文主要目的是了解 Egg.js 生成项目的目录结构,只有对项目结构有所了解,才能进行进一步的学习和开发。

Egg 的目录

版本不同和使用的类型不同,你的目录可能跟我的目录有所不同。学习时也没必要完全纠结。只要大概知道生成文件夹和文件的作用就可以了。

- app                        - 项目开发的主目录,工作中的代码几乎都写在这里面
-- controller                -- 控制器目录,所有的控制器都写在这个里面
-- router.js                 -- 项目的路由文件
- config                     - 项目配置目录,比如插件相关的配置
-- config.default.js         -- 系统默认配置文件
-- plugin.js                 -- 插件配置文件
- logs                       -- 项目启动后的日志文件夹
- node_modules               - 项目的运行/开发依赖包,都会放到这个文件夹下面
- test                       - 项目测试/单元测试时使用的目录
- run                        - 项目启动后生成的临时文件,用于保证项目正确运行
- typings                    - TypeScript 配置目录,说明项目可以使用 TS 开发
- .eslintignore              - ESLint 配置文件
- .eslintrc                  - ESLint 配置文件,语法规则的详细配置文件
- .gitignore                 - git 相关配置文件,比如那些文件归于 Git 管理,那些不需要
- jsconfig.js                - js 配置文件,可以对所在目录下的所有 JS 代码个性化支持
- package.json               - 项目管理文件,包含包管理文件和命令管理文件
- README.MD                  - 项目描述文件

dev 和 start 的区别

打开package.json文件的scripts属性中,有下面这样一段代码:

"scripts": {
    "start": "egg-scripts start --daemon --title=egg-server-egg",
    "stop": "egg-scripts stop --title=egg-server-egg",
    "dev": "egg-bin dev",
    "debug": "egg-bin debug",
    "test": "npm run lint -- --fix && npm run test-local",
    "test-local": "egg-bin test",
    "cov": "egg-bin cov",
    "lint": "eslint .",
    "ci": "npm run lint && npm run cov",
    "autod": "autod"
},

其中有 start 和 dev,这两个是有区别的,我在上节也简单的一嘴概括了。这里给大家详细的解释一下。

  • dev : 开发环境中使用,不用重启服务器,只要刷新。修改内容就会更改。
  • start:生产环境中使用,也就是开发完成,正式运营之后。以服务的方式运行。修改后要停止和重启后才会发生改变。

尝试创建一个新的页面

对目录和操作命令了解后,我们再试着去创建一个新的 页面。打开/app/controller/home.js,可以看到如下的代码:

'use strict';

const Controller = require('egg').Controller;

class HomeController extends Controller {
  async index() {
    const { ctx } = this;
    ctx.body = 'Hello World';
  }
}

module.exports = HomeController;

这里需要注意的是 Egg.js 全部使用异步模式async。我们在第 9 行的位置回车,编写下面的代码:

'use strict';

const Controller = require('egg').Controller;

class HomeController extends Controller {
  async index() {
    const { ctx } = this;
    ctx.body = 'Hello World';
  }

  async mybj(){
    const {ctx} = this;
    ctx.body="<h1>Hello MYBJ</h1>";
  }

}

module.exports = HomeController;

写完这个,你可以尝试这去浏览器输入[http://127.0.0.1:7001/mybj](http://127.0.0.1:7001/mybj), 但非常抱歉,这时并不能给你返回正确的结果。因为写完页面以后,还需要去配置路由router.js

打开/app/router.js文件,然后再第 9 行的位置,加入下面的代码:

router.get('/mybj', controller.home.mybj);

这样就设置完了路由,也就可以使用了。

'use strict';

/**
 * @param {Egg.Application} app - egg application
 */
module.exports = app => {
  const { router, controller } = app;
  router.get('/', controller.home.index);
  router.get('/mybj', controller.home.mybj);
};

其实我们并没有作过多的配置,开发时只要安装 Egg.js 的约定去写,这些配置它已经为我们处理好了。这也就是框架的设计理念**约定优于配置**.

好了,本文我们算是一个简单的入门,你只要会编写一个新的页面就可以了。

「点点赞赏,手留余香」

1

给作者打赏,鼓励TA抓紧创作!

微信微信 支付宝支付宝

还没有人赞赏,快来当第一个赞赏的人吧!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
码云笔记 » 02.Egg.js教程-Egg.js项目结构介绍

发表回复