当前位置: 首页 > 工具软件 > express-babel > 使用案例 >

nodejs + express或KOA 使用babel 和 nodemon 进行项目开发以及发布

麻鹏鹍
2023-12-01

一、安装nodemon实现项目热更新;

以前node中不管用什么框架,每次修改代码之后,都需要重新npm start 才能看到改动的效果,非常麻烦,所以这里引入nodemon模块,实现了不用重启也能自动更新这样的好处

1.全局安装nodemon

npm install -g nodemon

或者安装到本地

npm install nodemon --save

2.在项目目录下创建 nodemon.json 文件

{
    "restartable": "rs",
    "ignore": [
        ".git",
        ".svn",
        "node_modules/**/node_modules"
    ],
    "verbose": true,
    "execMap": {
        "js": "node --harmony"
    },
    "watch": [
        "controllers/*"
    ],
    "env": {
        "NODE_ENV": "development"
    },
    "ext": "ejs js json"
}

restartable-设置重启模式
ignore-设置忽略文件
verbose-设置日志输出模式,true 详细模式
execMap-设置运行服务的后缀名与对应的命令
{
“js”: “node –harmony”
}
表示使用 nodemon 代替 node
watch-监听哪些文件的变化,当变化的时候自动重启
ext-监控指定的后缀文件名

3.修改app.js文件

const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
var cors = require('koa2-cors');
const controller = require('./controller');
const app = new Koa();
app.use(cors());

app.use(bodyParser());


app.use(controller());
// add router middleware:

console.log(`\n==> ?  Listening on port 3000. Open up http://localhost:3000/ in your browser.\n`)
app.listen(3000);

4.配置完成之后,如果是全局装的nodemon,那直接运行即可

nodemon app.js

或者装的本地项目环境,那修改package.json运行

"scripts": {
    "start": "nodemon ./server.js"
  },

二、安装babel,让Node.js支持ES6的语法

不同版本的Node.js对Babel有不同的支持力度。为了让Node.js支持所需的ES6语法,可以加入Babel的支持。

1.安装Babel-cli。全局安装和本地安装都可以。

// 全局安装
npm install babel-cli -g
// 本地安装
npm install babel-cli --save

2.安装babel-preset-es2015来支持ES6的语法。

npm install babel-preset-es2015 --save

3.添加一个名为.babelrc的配置文件。方便babel-cli使用babel-preset-es2015。文件内容如下:

{
    "presets": [
        "es2015"
    ],
    "plugins": []
}

4.全局安装的直接运行看效果

babel-node index.js

5.本地安装的在package.json添加scripts语句

"start": "nodemon --exec babel-node index.js"

此时你的项目就已经支持所有es6的语法、import、async、await等…并且可以热更新了。

三、打包项目

为了让babel更高效的使用,需要安装几个npm模块,Browserify将模块打包到一个单独的文件,用Babelify让两者(Babel和Browserify)协同工作
1.安装Babelify、Browserify模块

npm i -D browserify babelify

默认情况下,Babel将ES6模块语法转换成等价的Node.js风格的require和module.exports语法。接着Browserify将node.js模块代码转换成ES5可以识别的函数。

 类似资料: