一、初始化项目
terminal:（创建项目文件并安装依赖）mkdir distinctrip && cd distinctrip
npm init egg --type=simple
cnpm i二、配置前端模板引擎
terminal:（安装前端模板引擎插件）cnpm i egg-view-ejs --saveconfig/plugin.js:（开启插件） // 前端模板引擎
ejs: {
enable: true,
package: 'egg-view-ejs',
}config/config.default.js:（配置前端模板引擎） // 配置前端模板引擎
config.view = {
mapping: {
'.html': 'ejs',
},
};三、配置数据库
terminal:（安装egg-mysql插件）
cnpm i --save egg-mysqlconfig/plugin.js:（开启插件）
// 数据库
mysql: {
enable: true,
package: 'egg-mysql',
}config/config.default.js:（配置mysql） // 配置数据库
config.mysql = {
// 单数据库信息配置
client: {
// host
host: '127.0.0.1',
// 端口号
port: '3306',
// 用户名
user: 'root',
// 密码
password: '',
// 数据库名
database: 'distinctrip',
},
// 是否加载到 app 上，默认开启
app: true,
// 是否加载到 agent 上，默认关闭
agent: false,
};四、创建第一阶段要完成的前端文件并完成跳转
在app文件夹下创建view文件夹，view文件夹下创建下面7个html文件：
index.html // 首页
login-register.html // 登录/注册页
scenic-list.html // 景点列表页
scenic-retrieve.html // 景点详情页
article-list.html // 路书列表页
article-retrieve.html // 路书详情页
personal-center.html // 个人中心页index.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title><%=title%></title>
</head>
<body>
<h1><%=title%></h1>
<a href="/login-register">登录/注册页</a>
<a href="/scenic-list">景点列表页</a>
<a href="/scenic-retrieve">景点详情页</a>
<a href="/article-list">路书列表页</a>
<a href="/article-retrieve">路书详情页</a>
<a href="/personal-center">个人中心页</a>
</body>
</html>login-register.html、scenic-list.html、scenic-retrieve.html、article-list.html、article-retrieve.html、personal-center.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title><%=title%></title>
</head>
<body>
<h1><%=title%></h1>
</body>
</html>创建controller文件，在app/controller文件夹下，创建：
index.js
user.js
article.js
scenic.js
account.jsindex.js：
'use strict';
const Controller = require('egg').Controller;
class IndexController extends Controller {
async index() {
await this.ctx.render('index', {
title: '首页'
})
}
}
module.exports = IndexController;
user.js：
'use strict';
const Controller = require('egg').Controller;
class UserController extends Controller {
async index() {
await this.ctx.render('personal-center', {
title: '个人中心'
})
}
}
module.exports = UserController;article.js：
'use strict';
const Controller = require('egg').Controller;
class ArticleController extends Controller {
async list() {
await this.ctx.render('article-list', {
title: '路书列表页'
})
}
async retrieve() {
await this.ctx.render('article-retrieve', {
title: '路书详情页'
})
}
}
module.exports = ArticleController;scenic.js：
'use strict';
const Controller = require('egg').Controller;
class ScenicController extends Controller {
async list() {
await this.ctx.render('scenic-list', {
title: '景点列表'
})
}
async retrieve() {
await this.ctx.render('scenic-retrieve', {
title: '景点详情'
})
}
}
module.exports = ScenicController;account.js：
'use strict';
const Controller = require('egg').Controller;
class AccountController extends Controller {
async index() {
await this.ctx.render('login-register', {
title: '登录/注册页'
})
}
}
module.exports = AccountController;app/router.js：
// 首页
router.get('/index', controller.index.index);
// 登录/注册
router.get('/login-register', controller.account.index);
// 景点列表
router.get('/scenic-list', controller.scenic.list);
// 景点详情
router.get('/scenic-retrieve', controller.scenic.retrieve);
// 路书列表
router.get('/article-list', controller.article.list);
// 路书详情
router.get('/article-retrieve', controller.article.retrieve);
// 个人中心
router.get('/personal-center', controller.user.index)命令行：
npm run dev进行测试。
有一个无关痛痒的动作：
app下新建extend文件夹，extend文件夹下新建application.js，扩展一个sleep函数：
module.exports = {
sleep(delay) {
var start = (new Date()).getTime();
while ((new Date()).getTime() - start < delay) {
continue;
}
}
};controller/home.js的index函数改为：
async index() {
const { ctx } = this;
ctx.body = 'The project for SRTP.';
ctx.app.sleep(2000);
ctx.redirect('/index');
}本想以此实现输入127.0.0.1:7001后显示The project for SRTP，在2秒之后跳转至首页。但实际上，没有成功加载页面，只是2秒后成功跳转了。
