今天来介绍一下egg.js的目录结构,以及vscode egg开发工具配置
一、egg.js目录结构介绍
二、egg.js目录约定规范
egg-project
├── package.json
├── app.js (可选)
├── agent.js (可选)
├── app
| ├── router.js
│ ├── controller
│ | └── home.js
│ ├── service (可选)
│ | └── user.js
│ ├── middleware (可选)
│ | └── response_time.js
│ ├── schedule (可选)
│ | └── my_task.js
│ ├── public (可选)
│ | └── reset.css
│ ├── view (可选)
│ | └── home.tpl
│ └── extend (可选)
│ ├── helper.js (可选)
│ ├── request.js (可选)
│ ├── response.js (可选)
│ ├── context.js (可选)
│ ├── application.js (可选)
│ └── agent.js (可选)
├── config
| ├── plugin.js
| ├── config.default.js
│ ├── config.prod.js
| ├── config.test.js (可选)
| ├── config.local.js (可选)
| └── config.unittest.js (可选)
└── test
├── middleware
| └── response_time.test.js
└── controller
└── home.test.js
如上,由框架约定的目录:
app/router.js
用于配置 URL 路由规则。app/controller/**
用于解析用户的输入,处理后返回相应的结果。app/service/**
用于编写业务逻辑层,可选,建议使用。app/middleware/**
用于编写中间件,可选。app/public/**
用于放置静态资源,可选。app/extend/**
用于框架的扩展,可选。config/config.{env}.js
用于编写配置文件。config/plugin.js
用于配置需要加载的插件。test/**
用于单元测试。app.js
和agent.js
用于自定义启动时的初始化工作,可选。
由内置插件约定的目录:
app/public/**
用于放置静态资源,可选。app/schedule/**
用于定时任务,可选。
三、egg执行流程:
当用户访问页面,如果没有中间件,先进行路由匹配,找到router.js文件,可知当用户访问路径为/时,会执行controller下home模块的index方法。
找到controller的home模块的index方法,可知为页面写入了hi,egg的内容
接下来,照葫芦画瓢,我们在router.js中新建一个路由配置,使用户访问到/login时执行controller下home模块的login方法。
在home.js里写入login方法,写入“我是登录页面” 字样。
紧接着访问/login 就能看到 文字渲染出来了:
当然,在项目中肯定不会只有一个controller,所以我们新建一个名为news的控制器,此处建议安装vscode eggjs扩展,以便快速生成controller模板等文件
当news.js建立完成后, 键入如下内容:
继续在路由里面做配置,访问/newsList时执行上图controller 中news模块下的getNewsList方法,访问/newsList 如下图:
但是,光给用户显示光秃秃的文字确实谈不上什么体验,最起码要渲染一个有样式有逻辑的页面吧。大家都知道,egg是一个基于nodejs的MVC框架,当用户输入url,先匹配路由。路由找对应的控制器,控制器中渲染页面和数据,需要数据就找model层要,model层去请求数据库返回数据。
MVC:
view: 视图,模板,页面展示 (约定app目录下view文件夹中)
Controllor控制器:负责处理业务逻辑(约定app目录下controller文件夹中)
model 模型: 和数据库打交道(约定app目录下service文件夹中)
明天给大家分享 静态资源 配置模板引擎 中间件等基础内容,敬请期待~~
来源:oschina
链接:https://my.oschina.net/u/4446873/blog/3221697