nodejs之koa2 -- koa-generator(快速搭建项目)

nodejs之koa2 – koa-generator(快速搭建项目)koa-generator话说，时间就是金钱，平时搭建项目的时候，一般都是使用脚手架，例如前端vue的cli，express的express-generator,所以koa的koa-generator就是快速生成项目骨架的koa的脚手架1.全局安装npm install -g koa-generator2.构建项目...

骑乌龟赛跑

7178人浏览 · 2019-03-13 13:49:28

骑乌龟赛跑 · 2019-03-13 13:49:28 发布

nodejs之koa2 – koa-generator(快速搭建项目)

koa-generator

话说，时间就是金钱，平时搭建项目的时候，一般都是使用脚手架，例如前端vue的cli，express的express-generator,react的react-create-app,所以koa的koa-generator就是快速生成项目骨架的koa的脚手架

1.全局安装

npm install -g koa-generator

2.构建项目

koa2 yourProjectName

结果如下
koa2

3.安装依赖

cd mykoa && npm i

结果如下
koa2

4.启动项目

npm start

浏览器访问localhost:3000
koa2

恭喜你，koa项目最基本的框架搭建成功

.
+-- bin
|   +-- www               // 项目启动必备文件,配置端口等服务信息
+-- node_modules          // 项目依赖，安装的所有模块都会在这个文件夹下
+-- public                // 存放静态文件，如样式、图片等
|   +-- images            // 图片
|   +-- javascript        // js文件
|   +-- stylesheets       // 样式文件
+-- routers               // 存放路由文件，如果前后端分离的话只用来书写api接口使用
|   +-- index.js
|   +-- user.js
+-- views                 // 存放存放模板文件，就是前端页面，如果后台只是提供api的话，这个就是备用
|   +-- error.pug
|   +-- index.pug
|   +-- layout.pug
+-- app.js                // 主入口文件
+-- package.json          // 存储项目名、描述、作者、依赖等等信息
+-- package-lock.json     // 存储项目依赖的版本信息，确保项目内的每个人安装的版本一致

模版文件

我一般使用ejs作为模版文件，express的时候就一直使用这个，和html基本没什么区别，先安装依赖模块

npm i ejs --save

然后在app.js中找到如下的

app.use(views(__dirname + '/views', {
    extension: 'pug'     // 直接将'pug'更改为'ejs'就可以了
}))

将views文件夹下的pug文件删掉，新建三个ejs文件

indes.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<h1><%= title %></h1>
</body>
</html>

error.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Error</title>
</head>
<body>
<h1><%= message %></h1>
<h2><b>hello koa!</b></h2>
<h2><%= error.status %></h2>
<pre><%= error.stack %></pre>
</body>
</html>

layout.ejs

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>layout</title>
</head>
<body>
<h1>已经退出！</h1>
</body>
</html>

然后重启项目，重新访问localhost:3000，就ok了

连接数据库

数据库准备，我这里使用的是mongodb，确认你已经安装好了mongodb

1.安装mongoose

npm i mongoose

安装完成之后，我们在根目录下新建一个db文件夹，里面是一个dnmongo.js文件，配置mongo数据库的基本信息

const mongoose = require ('mongoose');

let url = 'mongodb://127.0.0.1:27017/admin';
mongoose.connect (url, {
    user: 'root',
    pass: 'root@123',
    useNewUrlParser: true
});

mongoose.connection.on ('connected', function (s) {
    console.log ('连接到mongodb成功');
});
mongoose.connection.on ('error', function (e) {
    console.log (e);
});

module.exports = mongoose;

然后在public下新建一个model目录，目录下新建一个user.js,这就相当于创建了一个user表，这里就不多说，只说流程

var mongoose = require('../../db/dbmongo');
var Schema = mongoose.Schema;
var userSchema = new Schema({
    username: String,       // 用户名
    password: String,       // 密码
    portrait: String,       // 头像
    nickname: String,       // 昵称
    backgoundPic: String,   // 背景图像
    selfsign: String,       // 签名
},{
    timestamps: {
        createdAt: 'createtime',   // 创建时间
        updatedAt: 'updattime'     // 升级时间
    }});
var schema = mongoose.model('User',userSchema);
module.exports = schema;

然后在routers下的user.js里面引入创建的model

const User = require('../public/model/user');

重启项目，然后你会发现会输出以下log
koa2

这就表示你的项目已经连接到mongo了，剩下的就是快乐的撸代码了

本文纯手打，有不当之处请留言！如果对小伙伴们有帮助的话,点赞啊,谢谢!

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^