在上一部分说到要在node层也应用axios并应用拦截器，然而发现express当初不反对es6，本来的拦挡代码是用es6格调写的，于是要思考让express反对es6语法。

批改目录构造

切换到node-api目录下，新建src文件夹。

  • 创立 src/ 目录
  • 将 bin/ ， app.js 和 routes/ 挪动到 src 目录
  • 将 bin 目录中的 www 文件重命名为 www.js
  • 将 public/ 挪动到我的项目根目录

语法转换

编辑server/node_api/src/bin/www.js，正文掉头部的require指令批改为import

#!/usr/bin/env node/** * Module dependencies. */import app from '../app'import debugLib from 'debug'import http from 'http'const debug = debugLib('node-api:server')// var app = require('../app');// var debug = require('debug')('node-api:server');// var http = require('http');

编辑server/node_api/src/routes/index.js，用import替换require，export替换module.exports

// var express = require('express')// var router = express.Router()import express from 'express'var router = express.Router()/* GET home page. */router.get('/', function (req, res, next) {  res.render('index', { title: 'Express' })})// module.exports = routerexport default router

server/node_api/src/routes/users.js这个文件原本是也是放路由设置的，然而当前打算要用axios，会大改，就先删除掉或者全副正文掉。
持续编辑server/node_api/src/app.js，同样是用import语法代替require，同时留神因为批改了目录构造，所以views和public的门路也要批改，例如app.set('views', path.join(__dirname, '../views'))

import express from 'express'import path from 'path'import cookieParser from 'cookie-parser'import logger from 'morgan'import createError from 'http-errors'import indexRouter from './routes/index'  // 没有引入usersRouter了import cors from 'cors'const app =express()// var app = express()// view engine setupapp.set('views', path.join(__dirname, '../views'))app.set('view engine', 'jade')app.use(logger('dev'))app.use(express.json())app.use(express.urlencoded({ extended: false }))app.use(cookieParser())app.use(express.static(path.join(__dirname, '../public')))app.use('/', indexRouter)// app.use('/users', usersRouter)  // 这个正文掉// catch 404 and forward to error handlerapp.use(function (req, res, next) {  next(createError(404))})...// error handlerapp.use(function (err, req, res, next) {  // set locals, only providing error in development  res.locals.message = err.message  res.locals.error = req.app.get('env') === 'development' ? err : {}  // render the error page  res.status(err.status || 500)  res.render('error')})export default app

脚本配置

先装置npm-run-all，减少一次运行多个脚本的时候书写便当。
npm install npm-run-all --save-dev

装置 babel 和其余包。Babel 是一个 Javascript 编译器，次要用于将 ECMAScript 2015+ 版本的代码转换为向后兼容的 JavaScript 语法，以便可能运行在以后和旧版本的浏览器或其余环境中，比方 Node.js。在我的项目根目录关上终端命令行，输出上面命令，咱们会装置最新版的 babel（Babel 7）。

npm install -D @babel/core @babel/cli @babel/preset-env @babel/node

-D是示意装置的包放在devDependency --save是示意装置的包放在dependency下

在node-api根目录创立.babelrc.js写入以下代码

{ "presets": ["@babel/preset-env"] }

因为咱们应用 Babel 来转换不同类型的 js 语法，所以须要在 .babelrc 中配置 preset-env 预设（之前装置的），它会通知 Babel 去转换哪种类型。

在这些都设置好后，咱们就能够测试 node server是否在 ES6 语法环境下运行，首先，在 package.json 中增加 dev 脚本：

  "scripts": {     "server": "babel-node ./src/bin/www",     "dev": "NODE_ENV=development npm run server",    },

留神，门路由./bin/www变为了./src/bin/www，执行run npm dev曾经能够失常启动了。

生产筹备

prod 脚本 和 dev 脚本有点区别，咱们须要将 src 目录中的所有 js 文件代码转换为 nodejs 可能辨认的语法模式。运行 prod 脚本会生成一个和 src/ 目录构造相似的 dist/ 文件夹，然而每次在运行该脚本之前，咱们须要将旧的 dist/ 文件夹删除，确保咱们运行的是最新生成的代码。上面是具体步骤：

  • 创立 build 脚本，它会转换 src/ 中的文件代码并生成新的 dist/ 文件夹。
  • 装置 rimraf 包，并新建 clean 脚本，用来删除 dist/ 文件夹。
  • 新建 prod 脚本，将 clean，build，start server 脚本组合起来。

咱们先要装置 rimraf 包，用来删除某个文件夹

npm install rimraf --save

装置好后，在 package.json 的 scripts 字段中退出 clean 脚本，咱们会在 build 脚本中应用到它，当初整个 scripts 字段构造如下

"scripts": {    "server": "babel-node ./src/bin/www",    "server:prod": "node ./dist/bin/www",    "dev": "NODE_ENV=development npm run server",    "clean": "rimraf dist",    "build": "babel ./src --out-dir dist",    "start": "npm run prod",    "prod": "NODE_ENV=production npm-run-all clean build server:prod"  },

配置nodemon

减少一个watch脚本，通过配置文件，实现主动监听文件编号而后重启服务器，这样更优雅。
装置nodemon npm i -D nodemon
在node_api根目录下新增nodemon.json配置文件

{  "exec": "npm run dev",  "watch": ["src/*", "public/*"],  "ext": "js, html, css, json"}

增加一个watch脚本

  "scripts": {    "server": "babel-node ./src/bin/www",    "server:prod": "node ./dist/bin/www",    "dev": "NODE_ENV=development npm run server",    "clean": "rimraf dist",    "build": "babel ./src --out-dir dist",    "start": "npm run prod",    "prod": "NODE_ENV=production npm-run-all clean build server:prod",    "watch": "nodemon"  },

原文 在 Node 和 Express 中应用 ES6 （及以上）语法