Koa2 从入门到精通一

环境搭建 & 项目创建

安装 Node
全局安装脚手架 npm install -g koa-generator koa-generator
创建项目 koa2 项目文件名
进入项目安装依赖 cd 项目文件名 & npm install
运行项目 npm start

项目初始化依赖详解

// 使用koa-generator脚手架创建的koa2项目初始化自动安装的插件，demo/package.json
{
  "name": "demo",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "start": "node bin/www",
    "dev": "./node_modules/.bin/nodemon bin/www",
    "prd": "pm2 start bin/www",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "debug": "^4.1.1",
    "koa": "^2.7.0",
    "koa-bodyparser": "^4.2.1",
    "koa-convert": "^1.2.0",
    "koa-json": "^2.0.2",
    "koa-logger": "^3.2.0",
    "koa-onerror": "^4.1.0",
    "koa-router": "^7.4.0",
    "koa-static": "^5.0.0",
    "koa-views": "^6.2.0",
    "pug": "^3.0.2"
  },
  "devDependencies": {
    "nodemon": "^1.19.1"
  }
}

debug 调试插件 npm install debug -S

参考文档

npm 文档

koa 用来创建Koa应用 npm install koa -S

参考文档

// demo/app.js
const Koa = require('koa')
const app = new Koa()
app.use() // 使用中间件
app.on() // 事件监听
module.exports = app

koa-bodyparser npm install koa-bodyparser -S

用于解析POST请求body中的数据，如果没有解析到则返回空对象 {}

ctx.body = ctx.request.body 后续处理接口的时候都通过ctx.body获取处理过后的body数据

参考文档

还可以自定义相关的参数配置，参考文档

const Koa = require('koa')
const app = new Koa()
const bodyparser = require('koa-bodyparser')

// 使用中间件middlewares
app.use(bodyparser({
  enableTypes: ['json', 'form', 'text']
}))

koa-convert npm install koa-convert -S

参考文档

用于将koa中以前基于generator写法的中间件转为基于promise写法

将Koa旧版（0.x和1.x）生成器中间件转换为现代的Promise中间件（2.x）

Koa1.x是基于generator实现的

此处虽然装了该插件但并没有应用到

koa-json npm install koa-json -S

参考文档

用于设置返回的json格式，空格、是否美化换行等

const json = require('koa-json')
// 使用koa-json中间件
app.use(json())

const json = require('koa-json')
// 使用koa-json中间件
app.use(json({
  pretty: false
}))

koa-logger npm install koa-logger -S

参考文档

作用：日志输出

const Koa = require('koa')
const app = new Koa()
const logger = require('logger')
app.use(logger())
// logger 打印日志
app.use(async (ctx, next) => {
  const start = new Date()
  await next()
  const ms = new Date() - start
  console.log('你好', `${ctx.method} ${ctx.url} - ${ms}ms`)
})

koa-onerror npm install koa-onerror -S

参考文档

作用：错误处理

const Koa = require('koa')
const app = new Koa()
const onerror = require('koa-onerror')
onerror(app)

koa-router npm install koa-router -S

参考文档

路由

// demo/app.js
const Koa = require('koa')
const app = new Koa()
const index = require('./routes/index')
const users = require('./routes/users')
// routes，使用路由，allowedMethods捕获不符合的请求，会返回 `405 Method Not Allowed` 或 `501 Not Implemented`
app.use(index.routes(), index.allowedMethods())
app.use(users.routes(), users.allowedMethods())

// demo/routes/index.js
const router = require('koa-router')()

router.get('/', async (ctx, next) => {
  await ctx.render('index', {
    title: 'Hello Koa 2!'
  })
})

router.get('/string', async (ctx, next) => {
  ctx.body = 'koa2 string'
})

router.get('/json', async (ctx, next) => {
  ctx.body = {
    title: 'koa2 json'
  }
})

module.exports = router

// demo/routes/users.js
const router = require('koa-router')()

router.prefix('/users') // 路由前缀

router.get('/', function (ctx, next) {
  ctx.body = 'this is a users response!'
})

router.get('/bar', function (ctx, next) {
  ctx.body = 'this is a users/bar response'
})

module.exports = router

koa-static npm install koa-static -S

参考文档

作用：处理静态资源

可以指定多个静态目录

外部访问该文件夹里的静态资源时，不需要加上该文件名

// 将根路径下的public文件夹开放，让外部可以访问
const Koa = require('koa')
const app = new Koa()
app.use(require('koa-static')(__dirname + '/public'))
// app.use(require('koa-static')(__dirname + '/static')) 指定多个

koa-views npm install koa-views -S

参考文档

作用：视图管理

结合模板引擎使用

pug 模板引擎 npm install pug -S

参考文档

const Koa = require('koa')
const app = new Koa()
const views = require('koa-views')
app.use(views(__dirname + '/views', {
  extension: 'pug'
}))

此处用不到可以先不使用视图，我已经删除了根视图相关的东西

删除了demo/views，以及相关的js、css文件

修改了显示视图的路由

卸载koa-views和pug

npm uninstall koa-views pug

nodemon 热更新 npm install nodemon -D

此处已开启热更新，在package.json可查看

但需要结合cross-env环境变量设置

npm install cross-env -D

开发环境通过 npm run dev 启动项目就可以实现实时更新了，修改代码之后也能自动重启

Koa2（一）

Koa2 从入门到精通一

环境搭建 & 项目创建

项目初始化依赖详解