如何让 node 运行 es6 模块文件,及其原理
栏目: JavaScript · 发布时间: 5年前
内容简介:最新版的让因为
如何让 node 运行 es6 模块文件,及其原理
最新版的 node
支持最新版 ECMAScript
几乎所有特性,但有一个特性却一直到现在都还没有支持,那就是从 ES2015
开始定义的模块化机制。而现在我们很多项目都是用 es6
的模块化规范来写代码的,包括 node
项目,所以, node
不能运行 es6
模块文件就会很不便。
让 node
运行 es6
模块文件的方式有两种:
-
转码
es6
模块为commonjs
模块 -
hook
node
的require
机制,直接让node
的require
加载import/export
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.js import print from './print'; print('index'); export default print; # src/print.js export default str => { console.log('print: ' + str); };
因为 src
目录下的源文件都是 es6
模块化规范的, node
并不能直接运行,所以需要转码成 commonjs
规范的代码。
这个过程有两个方案:
-
如果不会单独使用
src
目录下的某个文件,而仅仅是以src/index.js
为入口文件使用,可以把src
目录下的文件打包成一个文件到lib/index.js
:这种方式推荐使用工具 rollup -
如果需要单独使用
src
目录下的文件,那就需要把src
目录下的文件一对一的转码到lib
目录下:这种方式推荐使用工具 gulp + babel
1.1 用 rollup
把 src
目录下的文件打包成一个文件到 lib/index.js
相关文件:
# rollup.config.js export 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.js const 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" } }
运行命令:
npm run build
结果:
# lib/index.js "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _print = _interopRequireDefault(require("./print")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } (0, _print.default)('index'); var _default = _print.default; exports.default = _default; # lib/print.js "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _default = str => { console.log('print: ' + str); }; exports.default = _default;
2. hook
node
的 require
机制,直接加载 import/export
这种机制一般是通过对 node
的 require
机制进行 hook
,劫持 require
抓取的源文件代码,把源代码转码成 commonjs
规范之后,再传送给 require
机制原本的代码流中。
pirates
之类的第三方 npm
包提供了这种添加 hook
的功能。
babel-register
便是使用这种方式达到 node
运行 es6
模块文件的目的的。
2.1 使用 babel-register
直接运行 es6
模块文件
示例目录:
- package.json - src/ - entry.js # 这里多了一个入口文件,专门用于注册 babel-register - index.js - print.js - ...
相关文件:
# package.json { "scripts": { "run": "node src/entry.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-transform-modules-commonjs": "^7.2.0", "@babel/register": "^7.0.0" } } # src/entry.js # 入口文件必须使用 commonjs 规范来写,因为还没有注册 hook require('@babel/register')({ plugins: ['@babel/plugin-transform-modules-commonjs'] }); require('./index'); # src/index.js import print from './print'; print('index'); # src/print.js export default str => { console.log('print: ' + str); };
运行:
npm run run
结果:
# 命令行打印 print: index
这种方式因为中间转码会有额外的性能损耗,所以不建议在生产环境下使用,只建议在开发模式下使用。
2.2 使用 babel-node
直接运行 es6
模块文件
babel-node
对 babel-register
进行了封装,提供了在命令行直接运行 es6
模块文件的便捷方式。
示例目录:
- package.json - src/ - index.js - print.js - ...
相关文件:
# package.json { "scripts": { "run": "babel-node src/index.js --plugins @babel/plugin-transform-modules-commonjs" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/node": "^7.2.0", "@babel/plugin-transform-modules-commonjs": "^7.2.0" } } # src/index.js import print from './print'; print('index'); # src/print.js export default str => { console.log('print: ' + str); };
运行:
npm run run
结果:
# 命令行打印 print: index
这种方式也不建议在生产环境下使用,只建议在开发模式下使用。
3. 链接
-
es6
就是指 ECMAScript 2015 -
es7
就是指 ECMAScript 2016 -
es8
就是指 ECMAScript 2017 -
es9
就是指 ECMAScript 2018
到写这篇文章为止,已发布了 ECMAScript 2018
。
后续
更多博客,查看 https://github.com/senntyou/blogs
作者: 深予之 (@senntyou)
版权声明:自由转载-非商用-非衍生-保持署名( 创意共享3.0许可证 )
以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网
猜你喜欢:- 前端模块化之AMD与CMD原理(附源码)
- 蚂蚁金服生产级 Raft 算法库存储模块剖析 | SOFAJRaft 实现原理 原 荐
- 从原理到代码:大牛教你如何用 TensorFlow 亲手搭建一套图像识别模块 | AI 研习社
- Node.js模块系统 (创建模块与加载模块)
- 黑客基础,Metasploit模块简介,渗透攻击模块、攻击载荷模块
- 022.Python模块序列化模块(json,pickle)和math模块
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Introduction to Linear Optimization
Dimitris Bertsimas、John N. Tsitsiklis / Athena Scientific / 1997-02-01 / USD 89.00
"The true merit of this book, however, lies in its pedagogical qualities which are so impressive..." "Throughout the book, the authors make serious efforts to give geometric and intuitive explanations......一起来看看 《Introduction to Linear Optimization》 这本书的介绍吧!