nodejs世界里面,模块化是非常常见的事情。正常情况下,大家都是遵守commonjs规范编写模块的,也就是使用require()引用模块,使用module.exports导出模块。在本文中,苏南大叔说的是es6模块,这种编写代码的方式,是nodejs的发展潮流,目前虽然还没有大规模普及。但是,在不久的将来,import的方式将会取代require的方式。

苏南大叔:nodejs的import和export,如何编写执行es6模块? - nodejs-import-export
nodejs的import和export,如何编写执行es6模块?(图4-1)

大家好,这里是苏南大叔的“程序如此灵动”博客,这里讲述苏南大叔和计算机代码的故事。使用import还是require,大家可以自行分辨。nodejs普遍支持commonjs标准的require语句,而目前并不是普遍支持es6 moduleimport语句。本文测试环境:win10node@16.14.0。本文描述的场景是通过node命令执行的场景,并不是浏览器里面使用import的场景。

本文使用场景及姿势

node里面目前一共有两种模块模式,一个是commonjs,另外一个是es6 module。另外一篇兄弟文章是:

苏南大叔:nodejs的import和export,如何编写执行es6模块? - 结构图对比
nodejs的import和export,如何编写执行es6模块?(图4-2)

在本文中,nodejs默认情况下,并没有开启es6特性支持,也就是说默认是不支持import的。所以,运行本文的范例的时候,需要有特殊的小技巧。否则可能会发生下面的类似错误提示:

import {default as bb} from './lib.js';
^^^^^^
SyntaxError: Cannot use import statement outside a module

苏南大叔:nodejs的import和export,如何编写执行es6模块? - 错误提示信息
nodejs的import和export,如何编写执行es6模块?(图4-3)

正确的打开方式

node支持import语句的方式有很多种,其中最简单的方式就是:

保存文件为.mjs,而不是通常的.js文件。这种情况下,使用node xxx.mjs语句的时候,就是默认支持es6 module特性的,其中就包括import语句。
需要注意的是:所有使用es6特性的相关文件都应该是.mjs,而不是仅仅主文件是.mjs

本文设置了两个.mjs文件,一个是main.mjs负责主程序(import),一个是lib.mjs负责类库(export)。

node main.mjs

姿势一:导入导出default

这个default是最常见的形式。注意:在一个.mjs文件中,只能有一个default被导出。

导出的两种姿势

lib.mjs直接导出:

export default function() {
    console.log("default")
}

或者lib.mjs别名导出:

function fun(){
    console.log("fun function")
}
export {fun as default};

可以作为default导出的数据

导出的default可以是一个函数,也可以是一个变量,可以是一个字符串,也可以是个数字。

var a="a string";
export default a;
export default "aa string";
export default 123;

导入default的方式

一个文件里面可以多次导入import,还可以设置别名as

import aa from './lib.mjs';  //默认导入default到aa变量

上面的语句,就相当于:

import {default as aa} from './lib.mjs';  //导入默认的default并且设置别名aa

姿势二:导入导出普通变量

除了导出为default,还可以导出为普通变量。这种情况下,除了default仅可以导出一份,其它的变量是可以随便导出的。

导出export

export default 1;
var a = "var a";
var bb = 'var b';
export {bb}           // 这是ES6的写法,实际上就是{b:b}
export {a,bb as b}; 
export var c = 100;
// export b;          // 报错
// export 1;          // 报错
其实关于export的写法,可以无脑的这么理解:export关键字后面不能直接接要导出的变量,或者加上个var,或者加个default,或者加个{

导入import

import aa from './lib.mjs';
console.log(aa);
import {default as aaa,a,b,c,bb} from './lib.mjs';
console.log(aaa,a,b,c,bb);

下面的这种写法,aaa,就相当于default as aaa

import aaa,{a,b,c,bb} from './lib.mjs';

import导入语句特别说明

下面的两个import语句

import aa from './lib.mjs';
import {aa} from './lib.mjs';

导入语句写不写花括号的区别在于:
不带花括号的话
导入的是default,相当于设置了个别名aa。相当于

import {default as aa} from './lib.mjs';

带花括号的话
导入的是名字aa,是确切的变量。同时意味着:在lib.mjs中明确导出了对应的变量aa

查看所有的导出

可以通过import *来导出所有的数据,例如:

import * as all from './lib.mjs';
console.log(all,all.a,all.b)

all的范例数据是:

[Module: null prototype] {
  a: 'var a',
  b: 'var b',
  bb: 'var b',
  c: 100,
  default: 1
}

苏南大叔:nodejs的import和export,如何编写执行es6模块? - import-all
nodejs的import和export,如何编写执行es6模块?(图4-4)

参考文献

总结

当然,这种commonjs也有其有问题的地方。所以,发展了新的es6模块,这里使用的组合是importexport这对组合。本文中,主要讨论importexport组合的使用方法。

如果本文对您有帮助,或者节约了您的时间,欢迎打赏瓶饮料,建立下友谊关系。
本博客不欢迎:各种镜像采集行为。请尊重原创文章内容,转载请保留作者链接。