在 Node 环境中无缝运行含 import 和 export 的ES6代码
一、需求
写了一个库,并且没有进行 webpack 的编译,也就是没有处理 ES6 的代码,尤其是 import 和 export。不进行 webpack 的预编译是因为不清楚使用者是否需要根据自己的需要进行编译。
这种情况下需要写一个在 node 环境测试的用例,就比较尴尬。
二、实现方式
Node 9 提供了 .mjs
的方式来使用 ES6 import 和 export,但是对于给 web 和 H5 使用的库,单独为了测试写好多 .mjs
文件完全没必要。
而自己的生产环境则在 Node 8.x,也无法使用 .mjs
。
搜了一下网上已有的解决方案,除了 babel-node
基本都是不靠谱的, babel-node
其实就是 node 环境下的一个 CLI(与 Node.js CLI 完全相同),能够在运行 js 之前,先跑 babel 进行解析,然后再去用 Node 提供运行环境。
babel-node 的地址:
比如运行一个 test.js
:
babel-node test.js
安装 babel-node
虽然可以将 babel-node 装在全局环境中,但是为了避免开发环境的差异性,还是装在项目开发依赖中比较靠谱。
yarn add -D @babel/core @babel/node
运行 babel-node
本地安装后,就可以通过 ./node_modules/.bin/babel-node
运行
./node_modules/.bin/babel-node test.js
配置 babel
既然要支持 babel
肯定是需要配置 .babelrc
的,这里我只是粗暴的配置了 @babel/preset-env
:
yarn add @babel/preset-env
.babelrc 文件:
{
"presets": ["preset-env"]
}
配置 package.json
为了方便测试则创建了一个 script 命令:
{
"scripts": {
"test": "./node_module/.bin/babel-node ./test/index.js"
},
"devDependencies": {
"@babel/core": "^7.3.4",
"@babel/node": "^7.2.2"
},
"dependencies": {
"@babel/preset-env": "^7.3.4"
}
}
这样如果要测试,直接运行 yarn test
即可。
三、示例
写了一个完整示例,文件结构如下:
index.js
import getName from './src';
export default getName;
src/index.js
import getName from './module';
export default function (name) {
console.log('[Info] Get Name Function');
return getName(name);
}
src/module.js
export default function (name) {
return 'name is : ' + name;
}
./test/index.js
import getName from '../index';
console.log(getName('Postbird'));
运行测试命令
yarn test
运行结果:
四、github
完整的 demo 放在了 github:
文章版权:Postbird-There I am , in the world more exciting!
本文链接:http://www.ptbird.cn/babel-node-es6-module-import-export.html
转载请注明文章原始出处 !
官方文档说生产环境不建议使用babel-node
scripts里module少了个s