最新版的 node 支持最新版 ECMAScript 几乎所有特性,但有一个特性却一直到现在都还没有支持,那就是从 ES2015 开始定义的模块化机制。而现在我们很多项目都是用 es6 的模块化规范来写代码的,包括 node 项目,所以,node 不能运行 es6 模块文件就会很不便。
让 node 运行 es6 模块文件的方式有两种:
因为 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 规范的代码。
这个过程有两个方案:
相关文件:
# 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;
相关文件:
# 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;
这种机制一般是通过对 node 的 require 机制进行 hook,劫持 require 抓取的源文件代码,把源代码转码成 commonjs规范之后,再传送给 require 机制原本的代码流中。
pirates 之类的第三方 npm 包提供了这种添加 hook 的功能。
babel-register 便是使用这种方式达到 node 运行 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
这种方式因为中间转码会有额外的性能损耗,所以不建议在生产环境下使用,只建议在开发模式下使用。
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
这种方式也不建议在生产环境下使用,只建议在开发模式下使用。
到写这篇文章为止,已发布了 ECMAScript 2018。
更多博客,查看 https://github.com/senntyou/blogs
在软件工程里面模块指的是可组合、分解和更换的单元。下面是一张css树,项目里面总的css文件是由一系列小的单元组成,比如下面的reset.css就是一个单元。模块化的概念不光在css里面
因为dojo本身带有模块加载的功能,会与webpack本身有冲突,所以需要借助esriLoder。esri-loader暴露了loadCss和loadModules两个方法,分别用来加载css和js文件。
我们知道,Node.js是基于CommonJS规范进行模块化管理的,模块化是面对复杂的业务场景不可或缺的工具,或许你经常使用它,但却从没有系统的了解过
最近公司在做一个项目,通过把我们自己的Webview植入第三方APP,然后我们的业务全部通过H5实现。至于为什么不直接用第三方APP WebView,主要是身处金融行业,需要做一些风控相关功能
例如在 ECMAScript 5 中引入的许多程序员首选的严格模式曾经是可选的,必须明确启用才行,同时它在 ES 模块中始终处于活动状态。因此,以下代码段在语法上可以解释为传统的 JavaScript 代码和 ES 模块
fs 模块=>包括文件目录的创建、删除、查询以及文件的读取、写入等;在 fs 模块中,所有的方法都分为同步和异步两种实现,具有 sync 后缀的方法为同步方法
export与export default均可用于导出常量、函数、文件、模块;你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式,将其导入,以便能够对其进行使用;
nodejs 提供了os.platform()和os.type(),可以用来识别操作系统平台。推荐使用: os.platform();平均负载是指:单位时间内,系统处于可运行状态和不可中断状态的平均进程数。
nodejs 的 zlib 模块提供了资源压缩功能。例如在 http 传输过程中常用的 gzip,能大幅度减少网络传输流量,提高速度。本文将从下面几个方面介绍 zlib 模块和相关知识点:文件压缩 / 解压,HTTP 中的压缩/解,压缩算法:RLE
ES6中 export 和 export default 与 import使用的区别,使用 react native 代码详解,现在流行的前端框架,angular+ 主要使用 export 导出模块,react native 中使用 export default 导出模块,如今编辑器非常强大,安装插件会自动弹出模块名称,知道其导出怎么使用就可以了
内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!