如何让node运行es6模块文件及其原理详解

最新版的 node 支持最新版 ECMAScript 几乎所有特性，但有一个特性却一直到现在都还没有支持，那就是从 ES2015 开始定义的模块化机制。而现在我们很多项目都是用 es6 的模块化规范来写代码的，包括 node 项目，所以，node 不能运行 es6 模块文件就会很不便。

让 node 运行 es6 模块文件的方式有两种：

1. 转码 es6 模块为 commonjs 模块

因为 node 支持几乎所有除 import/export 外的语法，所以我们只需要将 import/export 转码成 require/exports，而不需要转码其他语法。

比如下面的项目：

- package.json- src/ - index.js - print.js - ...

# package.json{ "main": "lib/index.js"    # 由工具转码 src 目录下源文件到 lib 目录下}# src/index.jsimport print from './print';print('index');export default print;# src/print.jsexport default str => { console.log('print: ' + str);};

因为 src 目录下的源文件都是 es6 模块化规范的，node 并不能直接运行，所以需要转码成 commonjs 规范的代码。

这个过程有两个方案：

1.1 用 rollup 把 src 目录下的文件打包成一个文件到 lib/index.js

相关文件：

# rollup.config.jsexport default { input: 'src/index.js', output: { file: 'lib/index.js', format: 'cjs', },};# package.json{ "scripts": { "build": "rollup -c" }, "devDependencies": { "rollup": "^0.66.4" }}

运行命令：

npm run build

结果：

# lib/index.js'use strict';var print = str => { console.log('print: ' + str);};print('index');module.exports = print;

1.2 用 gulp + babel 把 src 目录下的文件一对一的转码到 lib 目录下

相关文件：

# build.jsconst gulp = require('gulp');const babel = require('gulp-babel');gulp.task('babel', () => gulp.src('src/**/*.js') .pipe(babel({  plugins: ['@babel/plugin-transform-modules-commonjs'] })) .pipe(gulp.dest('lib')));gulp.series('babel')();# package.json{ "scripts": { "build": "node build.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-transform-modules-commonjs": "^7.2.0", "gulp": "^4.0.0", "gulp-babel": "^8.0.0" }}