参考文章:https://juejin.im/post/5c4f0590e51d45299a08d2bc

一、需求

写了一个库,并且没有进行 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

1.jpg

运行 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 即可。

三、示例

写了一个完整示例,文件结构如下:

2.jpg

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

运行结果:
3.jpg

四、github

完整的 demo 放在了 github: