MVC项目 · 天坑陈小傻

####前言：前后端分离有很多好处，不学一下有点不好意思。 # :-: **预热** > 快速开始 > [Gracejs](https://github.com/xiongwilee/Gracejs)(又称:koa-grace v2) 是全新的基于koa v2.x的MVC+RESTful架构的前后端分离框架 ``` $ git clone https://github.com/xiongwilee/Gracejs.git $ cd Gracejs && npm install $ npm run dev //打开(http://127.0.0.1:3000)查看页面 ``` > 文件目录 ![](https://box.kancloud.cn/37548bc6a3495b87ea7908a252702414_970x567.png) > 点开app目录，并打开dome目录 #### app目录 ![](https://box.kancloud.cn/bff1866c4e9575e19f299a4c786152be_984x169.png) #### dome目录 ![](https://box.kancloud.cn/dc36cb447f508670c14137bc43c5a445_978x110.png) # :-: 正文 > 把app文件夹下面的文件删除，新建ce文件，并且在ce文件夹下新建static，controller，views > ![](https://box.kancloud.cn/8ac513cbf34a5b2945ecd3b1f283f235_481x594.png) > 在controller中和views中分别新建index.js与index.html > ![](https://box.kancloud.cn/427d2e4da58539287f11f9eee4463546_266x156.png) > index.js文件内容 ``` /*路由index指向index*/ exports.index = async function () { //指向并带有参数title await this.render('index', { title: 'Hello , Grace!' }); } { /*路由index跳转百度*/ exports.test = async function() this.redirect('https://www.baidu.com') } /*路由gg指向index*/ exports.gg = async function(){ //指向并带有参数title await this.render('index', { title: 'gg!' }); } ``` > index.html文件内容 ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> /*index.js参数title，使用与ejs模板相同*/ {{title}} 测试测试 </body> </html> ``` # :-: **重点** > 打开根目录下的config - - > main.development.js文件。 > vhost在这里可以理解为，一个Gracejs server服务于几个站点。Gracejs支持通过host及host+一级path两种方式的映射。所谓的隐射，其实就是一个域名（或者一个域名+一级path）对应一个应用，一个应用对应一个目录。 ``` // vhost配置 vhost: { '127.0.0.1': 'ce' }, ``` > site是站点相关的配置，其中port可以修改端口号 ``` // 站点相关的配置 site: { env: 'development', port: 3000, hostname: 'localhost' }, ``` > path是路径相关的配置，及重定向，默认路径，项目文件夹等 ``` path: { // 项目文件目录 project: './app/', // 当直接访问域名时的默认路由 default_path: { ce: '/index/index' }, // 如果设置jump为false，则当直接访问域名时不重定向到default_path default_jump: { ce: false } }, ``` # :-: **最后** > 最后在启动项目 ``` npm run dev ``` > 在浏览器里面打开[http://127.0.0.1:3000](http://127.0.0.1:3000) 留言：希望对大家有帮助，学不动啦w(ﾟДﾟ)w。