现在写前端大多数情况下会应用蛮多ES6的语法，当你在写Node的时候，当然也会希望使用ES6的特性了，不然会搞得你有些沮丧，淘宝有一篇专门写了这个。不过有些时间了，不是很赞同那样做。

根据自己的理解，查了下Babel官网的介绍, 可以作如下的配置:

不同的Node版本兼容的ES6可以查看这里。

安装babel-preset及babel工具

根据官网的介绍，利用这个你可以指定不同的环境而不用去手动配置plugins, 旧的只支持当年批准的那个议案。

安装自己所需要的环境

1
2
3
4
5
6
# 安装 core 和命令行工具
npm install --save-dev babel-core babel-cli
# 安装 babel环境支持
npm install babel-preset-env --save-dev
# 安装 nodemon可以在你修改的时候自动重新加载node推荐安装哦
npm i -g nodemon

配置.babelrc

创建.babelrc,当只写["env"]的时候表示是兼容最新亦即包括(babel-preset-es2015, babel-preset-es2016, and babel-preset-es2017三个一起)。

因为这边是针对的Node，这里有一个配置蛮好:

1
2
3
4
5
6
7
8
9
{
  "presets": [
    ["env", {
      "targets": {
        "node": "current"
      }
    }]
  ]
}

这样配置以后，babel会根据你的Node的不同版本，自动添加不同的兼容插件，而不用你手动去加载。

配置package.json

1
2
3
4
5
6
7
8
9
{
  "main": "dist/server.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "nodemon --exec babel-node src/server.js",
    "build": "babel src --out-dir dist",
    "release": "npm run build && NODE_ENV=production nodemon dist/server.js"
  }
}

然后最后如果plugins和presets一起也是可以的，就是需要注意这两个配置起来必须最后可以在任意一处可以输出对应的兼容的代码，否则打包出来的代码是不兼容的代码。比如没配置好那个import的支持就尴尬了

调试

对于Nodejs的原生代码

根据nodejs官方调试文档可以得知大概有以下步骤:

  • nodejs内置了node-inspect当然也可以单独安装npm i -g node-inspect，使用命令node --inspect 代码.js即可。(这里如果是写成node inspect 代码.js的话是直接进入命令行的调试而不能在Chrome devtools中打开的，切记!)。

  • 在Chrome 55+的浏览器中打开chrome://inspect即可进行调试，或者你也可以安装NIM。

另外在Visual Studio, JetBrains WebStorm, VS Code都提供了对nodejs的友好调试，只需点击debug即可。

另外,nodejs使用的是--inspect-brk,--debug-brk已经被遗弃

调试Node ES6

命令行

使用命令行babel-node debug src/server.js即可在命令行调试代码。然后用在命令行中用next执行下一条命令, 这个里面的命令其实和在控制台调试JavaScript是保持一致的,比如当你在浏览器中调试代码里面可以设置断点之类，然后在最面板中有step,next等图标。

另外当使用babel-node --inspect或者babel-node --inspect-brk的进修然后打开Chrome浏览器中输入chrome://inspect即可进行调试。

WebStorm编辑器

在编辑器设置步骤是先打开配置搜索JavaScript在里面配置使其支持ES6。

然后在那个Debug的右边的第一个选项卡配置的Node interpreter设置成为自己本地或者全局安装的那个babel-node.js的路径。这个babel-node是由安装babel-cli包所生成的。可以指定本项目下面的或者是全局的那个都可以。

最后在Node parameters中设置参数由于node 8.x版本使用--inspect-brk或者--inspect都可以,--debug-brk已经被遗弃或者使用

最后，大功告成，就可以愉快地在Node下写ES6了。以上如有不对的地方还望指教，谢谢-^.^-。

TodoList:

  • 这个调试的时候发现不会热更新，笑哭，应该怎么实现呢？