就算遇到ES6和Node中module的坑，也要承认世界将是JavaScript的-唐霜

PHP是世界上最好的语言，而JavaSc转载请注明出处：www.tangshuang.net【未经授权禁止转载】ript将统治全世界
本文版权归作者所有，未经授权不得转载。【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。

【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】

今天就来扒一扒在node和ES6中的mo【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】dule，主要是为了区分node和ES6【本文受版权保护】未经授权，禁止复制转载。中的不同意义，避免概念上的混淆，同时也分本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。享一下，自己在这个坑里获得的心得。

在ES6之前本文作者：唐霜，转载请注明出处。

模块的概念是在ES6发布之前就出现的，我【版权所有】唐霜 www.tangshuang.net转载请注明出处：www.tangshuang.net感觉主要是为了适应大型应用开发的需要而引【本文首发于唐霜的博客】【版权所有，侵权必究】入了JavaScript世界。模块化编程本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。已经从噱头上升为必备，所以ES6也顺应时【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】代，把这个写进了标准。

【转载请注明来源】【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】【转载请注明来源】

而且node发布的时候，就天生具备mod本文作者：唐霜，转载请注明出处。原创内容，盗版必究。ule，所以从某种意义上讲，是node促【作者：唐霜】本文作者：唐霜，转载请注明出处。进了js世界里面的模块化编程。

// module-file.js for node
module.exports = {
  a : function() {},
  b : 'xxx'
};

把上面这个js文件放在node环境中，我【转载请注明来源】【关注微信公众号：wwwtangshuangnet】们这样去用它：

本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】

var myModule = require('./module-file');
var b = myModule.b;myModule.a();

【未经授权禁止转载】【本文受版权保护】【原创不易，请尊重版权】【本文受版权保护】

【作者：唐霜】转载请注明出处：www.tangshuang.net本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】

// module-file.js for requirejs
define(function(require, exports, module){
   module.exports = {};
});

requirejs和seajs都支持上面本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net这种形式，在define的回调函数中提供【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】了模拟的require, exports原创内容，盗版必究。【原创不易，请尊重版权】, module，折让习惯了node环境【本文首发于唐霜的博客】【版权所有】唐霜 www.tangshuang.net中使用方法的猿类可以顺便在浏览器端写基本【本文首发于唐霜的博客】【转载请注明来源】相同的代码。

著作权归作者所有，禁止商业用途转载。【本文受版权保护】原创内容，盗版必究。【本文受版权保护】

define(function(){
  return {}; // return的值就是导出的模块
});

Node,requirejs中的expo本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.netrts

本文作者：唐霜，转载请注明出处。【本文受版权保护】本文版权归作者所有，未经授权不得转载。【作者：唐霜】

node中导出模块接口就是用export原创内容，盗版必究。【转载请注明来源】s，你可以这样做：

本文作者：唐霜，转载请注明出处。【本文首发于唐霜的博客】【未经授权禁止转载】【作者：唐霜】

module.exports.a = function() {};
module.exports.b = 'xxx';

著作权归作者所有，禁止商业用途转载。【作者：唐霜】著作权归作者所有，禁止商业用途转载。

module.exports = {
  a : function() {},
  b : 'xxx'
}

【原创内容，转载请注明出处】【作者：唐霜】原创内容，盗版必究。未经授权，禁止复制转载。

define(function(require, exports, module){
   exports.a = function(){};
   exports.b = 'xxx';
});

var exrpots = module.exports;

因此，你必须注意两个点，就是导出接口的时著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。候：1.不能直接用exports={}来转载请注明出处：www.tangshuang.net【未经授权禁止转载】导出整个接口；2.如果使用了module未经授权，禁止复制转载。【原创不易，请尊重版权】.exports={}，那么export【作者：唐霜】【本文受版权保护】s.a等都会被覆盖无效。

【原创不易，请尊重版权】【本文受版权保护】【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。未经授权，禁止复制转载。

这是非常容易理解的，如果你不是很理解，可【作者：唐霜】【本文首发于唐霜的博客】以阅读我写的《JavaScript引用类型数据【作者：唐霜】》一文。转载请注明出处：www.tangshuang.net

ES6中的import和export【本文首发于唐霜的博客】

本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。【未经授权禁止转载】原创内容，盗版必究。

在ES6之前，要使用一个模块，必须使用r【未经授权禁止转载】【本文首发于唐霜的博客】equire函数将一个模块引入，但ES6【作者：唐霜】【版权所有】唐霜 www.tangshuang.net并没有采用这种模块化方案，在ES6中使用著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。import指令引入一个模块或模块中的部【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】分接口，并没有将require写入标准，著作权归作者所有，禁止商业用途转载。【关注微信公众号：wwwtangshuangnet】这也就是说require对于ES6代码而未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net言，只是一个普通函数。

同理，在ES6标准中，导出模块的接口也只原创内容，盗版必究。未经授权，禁止复制转载。能使用export指令，而非export【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.nets对象，这也同样意味着module.ex【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。ports只是node，requirej【转载请注明来源】著作权归作者所有，禁止商业用途转载。s等模块化库的自定义变量，而非ES标准接【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。口。

当然，ES6的模块化也很复杂，不只模块接著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。口的导入导出这点东西，只不过本文无耻的只本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】讨论这个相对而言比较常见的问题。

本文作者：唐霜，转载请注明出处。原创内容，盗版必究。【转载请注明来源】

常见export方式本文作者：唐霜，转载请注明出处。

【未经授权禁止转载】【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】

在ES6规定中，这样导出一个模块的接口：

【原创不易，请尊重版权】【原创内容，转载请注明出处】未经授权，禁止复制转载。【原创不易，请尊重版权】原创内容，盗版必究。

export function fun() {};
export { name1, name2, …, nameN };
export { variable1 as name1, variable2 as name2, …, nameN };
export let name1, name2, …, nameN; // also var
export let name1 = …, name2 = …, …, nameN; // also var, const
export default expression;
export default function (…) { … } // also class, function*
export default function name1(…) { … } // also class, function*
export { name1 as default, … };
export * from …;export { name1, name2, …, nameN } from …;
export { import1 as name1, import2 as name2, …, nameN } from …;

ES6里面，直接把要导出的变量、函数、对【关注微信公众号：wwwtangshuangnet】【本文受版权保护】象、类等前面加一个export关键字。比【未经授权禁止转载】【原创内容，转载请注明出处】如：

【本文首发于唐霜的博客】【转载请注明来源】未经授权，禁止复制转载。

// module-file.js
export function a(){};
export var obj = {};

未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。

// 错误演示
export 1; // 这种导出的内容不是变量是绝对错误的，包括导出表达式，也是绝对错误的
var a = 1;
export a;
function b() {}
export b;

上面的这些方法都是错误的，不能这样导出接【作者：唐霜】【未经授权禁止转载】口。导出接口仅限两种：

【原创内容，转载请注明出处】【原创不易，请尊重版权】未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。

1.声明时导出转载请注明出处：www.tangshuang.net
未经授权，禁止复制转载。未经授权，禁止复制转载。 2.以对象的形式导出（和解构联系起来）

【转载请注明来源】著作权归作者所有，禁止商业用途转载。【本文受版权保护】著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。

如果要导出某个变量，可以用花括号括起来，著作权归作者所有，禁止商业用途转载。转载请注明出处：www.tangshuang.net像这样：

【原创不易，请尊重版权】本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】

var a = 1;
export {a}; // 等效于：{a:a}
function b() {}
export {b};

我有点疑惑的是，为何export允许多次本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】export {}这种形式？看上去很奇怪本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net。另外，ES6更厉害之处在于，可以在ex著作权归作者所有，禁止商业用途转载。【访问 www.tangshuang.net 获取更多精彩内容】port变量之后，继续修改变量：

【本文受版权保护】本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】

export var obj {};obj.a = 1;

在import之后，obj的值仍然可以在【本文受版权保护】【本文受版权保护】模块内继续改变，这是CommonJS以往【原创内容，转载请注明出处】本文作者：唐霜，转载请注明出处。不可能做到的。

【转载请注明来源】著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。

import基本用法【未经授权禁止转载】

【作者：唐霜】本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。

在另外一个js文件里面这样使用这些接口：

【本文受版权保护】转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

import {a,obj} from './module-file';a();alert(obj.b);

和node之前的require不一样，r【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。equire只能把模块放到一个变量中，而【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。在ES6中，拥有对象解构赋值转载请注明出处：www.tangshuang.net的能力，所以直接就把引入的模块的接口赋值著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。给变量了。内在机理也有不同，requir原创内容，盗版必究。【本文受版权保护】e需要去执行整个模块，将整个模块放到内存【原创不易，请尊重版权】【版权所有，侵权必究】中（也就是我们说的运行时），如果只是使用【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】到其中一个方法，性能上就差很多，而imp【版权所有】唐霜 www.tangshuang.net【版权所有】唐霜 www.tangshuang.netort…from则是只加载需本文作者：唐霜，转载请注明出处。【作者：唐霜】要的接口方法，其他方法在程序启动之后根本【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。触及不到，所以这种又被称为“编译时”，性【作者：唐霜】原创内容，盗版必究。能上好很多。

as关键字原创内容，盗版必究。

【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。本文作者：唐霜，转载请注明出处。

【作者：唐霜】【本文受版权保护】【访问 www.tangshuang.net 获取更多精彩内容】

// a.jsvar a = function() {};export {a as fun};
// b.jsimport {fun as a} from './a';a();

上面这段代码，export的时候，对外提【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net供的接口是fun，它是a.js内部a这个【转载请注明来源】著作权归作者所有，禁止商业用途转载。函数的别名，但是在模块外面，认不到a，只本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】能认到fun。

本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】【本文首发于唐霜的博客】未经授权，禁止复制转载。

import中的as就很简单，就是你在使【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net用模块里面的方法的时候，给这个方法取一个【本文受版权保护】【关注微信公众号：wwwtangshuangnet】别名，好在当前的文件里面使用。之所以是这【版权所有，侵权必究】著作权归作者所有，禁止商业用途转载。样，是因为有的时候不同的两个模块可能通过【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】相同的接口，比如有一个c.js也通过了f本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。un这个接口：

本文版权归作者所有，未经授权不得转载。【作者：唐霜】【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net

// c.jsexport function fun() {};

原创内容，盗版必究。【访问 www.tangshuang.net 获取更多精彩内容】【原创内容，转载请注明出处】【转载请注明来源】

default关键字未经授权，禁止复制转载。

【本文受版权保护】【原创内容，转载请注明出处】【转载请注明来源】本文版权归作者所有，未经授权不得转载。【原创内容，转载请注明出处】

其他人写教程什么的，都把default放【本文受版权保护】本文版权归作者所有，未经授权不得转载。到export那个部分，我觉得不利于理解本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】。在export的时候，可能会用到def【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。ault，说白了，它其实是别名的语法糖：

// d.jsexport default function() {}
// 等效于：function a() {};export {a as default};

在import的时候，可以这样用：【转载请注明来源】

【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。

import a from './d';
// 等效于，或者说就是下面这种写法的简写，是同一个意思import {default as a} from './d';

这个语法糖的好处就是import的时候，著作权归作者所有，禁止商业用途转载。【原创内容，转载请注明出处】可以省去花括号{}。简单的说，如果imp转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。ort的时候，你发现某个变量没有花括号括【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。起来，那么你在脑海中应该把它还原成有花括【作者：唐霜】【未经授权禁止转载】号的as语法。

【本文首发于唐霜的博客】转载请注明出处：www.tangshuang.net【本文首发于唐霜的博客】【作者：唐霜】【原创内容，转载请注明出处】

所以，下面这种写法你也应该理解了吧：【本文受版权保护】

转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。

import _,{each,map} from '_';

*符号原创内容，盗版必究。

*就是代表所有，只用在import中，我【作者：唐霜】【原创不易，请尊重版权】们看下两个例子：

【本文受版权保护】【本文受版权保护】未经授权，禁止复制转载。【本文首发于唐霜的博客】

import * as underscore from '_';

在意义上和著作权归作者所有，禁止商业用途转载。import _ from '_';是不同的，虽然实际上后面的使用方法是一样未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net的。它表示的是把’_R【关注微信公众号：wwwtangshuangnet】【本文受版权保护】17;模块中的所有接口挂载到unders【原创内容，转载请注明出处】【本文受版权保护】core这个对象上，所以可以用under【原创内容，转载请注明出处】【访问 www.tangshuang.net 获取更多精彩内容】score.each调用某个接口。

【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】【本文受版权保护】【原创内容，转载请注明出处】【未经授权禁止转载】

export * from '_';
// 等效于：import * as all from '_';export all;

该用require还是import？【原创不易，请尊重版权】

本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】原创内容，盗版必究。【本文受版权保护】【本文首发于唐霜的博客】

接下来的问题，就是我们在实操中，还有必要【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】用require吗？我感觉ES6标准已经【原创不易，请尊重版权】【本文受版权保护】将之前的所有模块化规范都给碾压了，这在以本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】前的标准发布中极少见，ES6用更加简单的【关注微信公众号：wwwtangshuangnet】【本文受版权保护】方式，实现了更加有效的module，感觉本文作者：唐霜，转载请注明出处。原创内容，盗版必究。require可以回家养老了。

标准与非标准未经授权，禁止复制转载。

既然是标准，那么就是所有引擎应该去实现的【作者：唐霜】【原创内容，转载请注明出处】，node和浏览器未来都会直接支持这种模【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。块加载方式，require完成历史使命回【原创不易，请尊重版权】【关注微信公众号：wwwtangshuangnet】家自己玩儿。而且作为node或浏览器，同【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。时可以利用import提供自己的API，【作者：唐霜】【原创内容，转载请注明出处】比如手机端提供基于网络的定位API，这都【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】不用SDK了，直接内置在客户端内部，im本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。port一下就可以了。

【未经授权禁止转载】【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。转载请注明出处：www.tangshuang.net【访问 www.tangshuang.net 获取更多精彩内容】

不过现在import导入模块还并不是全部【原创不易，请尊重版权】转载请注明出处：www.tangshuang.net环境都支持，使用babel可以让node【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。支持ES6，但在浏览器端，则毫无办法，可【原创不易，请尊重版权】著作权归作者所有，禁止商业用途转载。能还得暂时依赖require。但是非常不【版权所有】唐霜 www.tangshuang.net【版权所有，侵权必究】好的消息是，require不是ES6标准【版权所有】唐霜 www.tangshuang.net【转载请注明来源】，这也就是说如果将来浏览器支持impor著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。t后，你想用它，就必须升级代码，而不能直【版权所有，侵权必究】转载请注明出处：www.tangshuang.net接被兼容。

import只能在文件开头使用，在imp【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】ort之前，你不能有其他的代码，这和其他转载请注明出处：www.tangshuang.net【原创内容，转载请注明出处】语言是一样的。但是require则不同，【本文首发于唐霜的博客】未经授权，禁止复制转载。它相当于node的一个定义在全局的函数，【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。你可以在任意地方使用它，甚至使用变量表达【关注微信公众号：wwwtangshuangnet】未经授权，禁止复制转载。式作为它的参数，这样有一个好处，就是可以【原创内容，转载请注明出处】原创内容，盗版必究。在循环中加载模块。

未经授权，禁止复制转载。【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。

【原创不易，请尊重版权】【本文首发于唐霜的博客】本文版权归作者所有，未经授权不得转载。本文版权归作者所有，未经授权不得转载。

但是很坑的是，node的模块导出和ES6转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】标准也不符，因为node的模块体系遵循的转载请注明出处：www.tangshuang.net未经授权，禁止复制转载。是CommonJS规范，这就导致你写的模【版权所有】唐霜 www.tangshuang.net未经授权，禁止复制转载。块文件，不可能同时支持require和i【未经授权禁止转载】本文作者：唐霜，转载请注明出处。mport。

// module-file.jsmodule.exports = {};
// a.jsimport a from './moule-file';

这种混搭感觉不是很好（但可以用，下面有解本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】释）。所以，其实我没有任何建议，我只是觉本文作者：唐霜，转载请注明出处。【本文受版权保护】得，躺在坑里，挺自在的……毕竟node中原创内容，盗版必究。【本文首发于唐霜的博客】require的使用更加灵活一点，它没有转载请注明出处：www.tangshuang.net【作者：唐霜】必须放在哪里的限制，所以可以在任意位置使【本文受版权保护】未经授权，禁止复制转载。用，而且它的结果也非常形象，甚至可以把r未经授权，禁止复制转载。【本文受版权保护】equire当做一个引用类型别名，可以这【作者：唐霜】原创内容，盗版必究。样使用：

未经授权，禁止复制转载。本文作者：唐霜，转载请注明出处。【原创不易，请尊重版权】

require('./a')(); // a模块是一个函数，立即执行a模块函数
var data = require('./a').data; // a模块导出的是一个对象
var a = require('./a')[0]; // a模块导出的是一个数组

这样的写法感觉像给模块取了一个别名，使用本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】的时候非常灵活。但是需要注意的是，如果你【访问 www.tangshuang.net 获取更多精彩内容】本文作者：唐霜，转载请注明出处。打算使用require来导入这个模块，那著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。么请使用module.exports导出未经授权，禁止复制转载。【关注微信公众号：wwwtangshuangnet】这个模块。

（临时）兼容方案【本文受版权保护】

有没有一种兼容方案呢？原创内容，盗版必究。

function a() {}
class b {}
module.exports = {a,b}; // {a,b}是ES6的写法

在实践中发现，module.export未经授权，禁止复制转载。【作者：唐霜】s可以兼容require和import，本文作者：唐霜，转载请注明出处。【作者：唐霜】而且这个案例需要你的node环境配置好支著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】持ES6语法。module.export【作者：唐霜】【原创内容，转载请注明出处】s导出的模块，如果使用import，那么本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。完全就是一个对象赋值、解构的过程：

本文作者：唐霜，转载请注明出处。著作权归作者所有，禁止商业用途转载。未经授权，禁止复制转载。

import mod,{a,b} from './a';

之所以这是成立的，是因为我们使用babe【版权所有】唐霜 www.tangshuang.net【转载请注明来源】l对ES6代码进行转码后执行，而实际上，转载请注明出处：www.tangshuang.net【版权所有】唐霜 www.tangshuang.net目前为止，没有任何一个环境是支持ES6 【版权所有】唐霜 www.tangshuang.net著作权归作者所有，禁止商业用途转载。module方案的，即使babel，也仅本文版权归作者所有，未经授权不得转载。【原创不易，请尊重版权】仅是将ES6的import,export著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。转码为require, module.e【本文受版权保护】【本文首发于唐霜的博客】xports后交给node去执行。

导出的模块接口被赋值给mod，所以mod【作者：唐霜】原创内容，盗版必究。是一个对象，含有a,b两个方法。这里的m【转载请注明来源】本文版权归作者所有，未经授权不得转载。od并没有通过default导出，所以和未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。ES6有非常大的意义上的区别，这种非标准【本文首发于唐霜的博客】未经授权，禁止复制转载。的写法，墙裂建议永远不要用。而且，由于r【转载请注明来源】本文版权归作者所有，未经授权不得转载。equire和module.export转载请注明出处：www.tangshuang.net原创内容，盗版必究。s是非标准的东西，仅在Node环境中有效【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】，所以当未来浏览器支持模块导入时，并不会【关注微信公众号：wwwtangshuangnet】【本文首发于唐霜的博客】主动提供require，而是采用impo本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。rt，如果要使用require，还是不得【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。不使用requirejs等库，借助def【版权所有，侵权必究】【未经授权禁止转载】ine来用。

【转载请注明来源】本文版权归作者所有，未经授权不得转载。【本文首发于唐霜的博客】

所以，最终，如果你打算用CommonJS【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net，就不要掺和进ES6.

【版权所有】唐霜 www.tangshuang.net【作者：唐霜】【版权所有】唐霜 www.tangshuang.net本文作者：唐霜，转载请注明出处。原创内容，盗版必究。转载请注明出处：www.tangshuang.net转载请注明出处：www.tangshuang.net著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。未经授权，禁止复制转载。转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】【原创内容，转载请注明出处】著作权归作者所有，禁止商业用途转载。【版权所有】唐霜 www.tangshuang.net【未经授权禁止转载】转载请注明出处：www.tangshuang.net【原创不易，请尊重版权】【访问 www.tangshuang.net 获取更多精彩内容】本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net【原创不易，请尊重版权】本文作者：唐霜，转载请注明出处。【本文受版权保护】【转载请注明来源】【版权所有，侵权必究】【转载请注明来源】【未经授权禁止转载】未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。【未经授权禁止转载】本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net【关注微信公众号：wwwtangshuangnet】【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。【访问 www.tangshuang.net 获取更多精彩内容】著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】本文版权归作者所有，未经授权不得转载。【转载请注明来源】【转载请注明来源】著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net【转载请注明来源】本文版权归作者所有，未经授权不得转载。【本文受版权保护】【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。【访问 www.tangshuang.net 获取更多精彩内容】【未经授权禁止转载】

2016-11-07 36521 ES6, import, nodejs, require

已有11条评论

ych 2020-07-06 11:18

node有用es module的打算吗，作为小白来说，不知道他两的性能，但是论好用程度后者明显碾压啊，但是我怎么看node文档，node挺自豪commonjs的。。。甚至还有点瞧不起esmodule

回复
- 否子戈 2020-07-08 09:36
  
  node已经支持import mjs文件，浏览器也支持了。
  node作为js的运行环境，只会向ES标准靠近。当然，它保留自己的commonjs和独特api，是无可厚非的。
  有兴趣可以体验一下deno这个环境。
  
  回复
小飞侠 2020-05-23 16:50

抱歉，在下是来挑刺的，阁下文中有一处严重的错误，
》以对象的形式导出（和解构联系起来）
》export {a}; // 等效于：{a:a}
此处export的‘{ }’是语法结构，而非对象或解构
eg: export { a as ax, a as default }
若以阁下所言，》等效于：{a:a}。然经在下实测，无论export {a:a},export {b:a},export {a:b},皆为非法。
export导出接口，而非对象，【https://es6.ruanyifeng.com/#docs/module】,
换言之，它对外暴露模块内部的变量（方法，类..）的引用

还望阁下认真求证，谨言慎行。

回复
- 否子戈 2020-05-23 17:53
  
  我看了很久，也没有找到你所指出的export {a:a}问题，export 导出语法只有 export { a as b } 这种形式。
  这篇文章后面部分讨论的是ESModule和commonjs混用的时候的一些实际情况，你评论中估计是在说这一块。具体可以再阅读一下文章，另外，后续我也更新了关于webpack tree shaking使用时的一些新规则，可以查看这篇文章 https://www.tangshuang.net/7686.html
  
  回复
  - 小飞侠 2020-05-23 18:02
    
    在3.export 命令
    以下是原话
    需要特别注意的是，export命令规定的是对外的接口，必须与模块内部的变量建立一一对应关系。
    
    // 报错
    export 1;
    
    // 报错
    var m = 1;
    export m;
    上面两种写法都会报错，因为没有提供对外的接口。第一种写法直接输出 1，第二种写法通过变量m，还是直接输出 1。1只是一个值，不是接口。正确的写法是下面这样。
    
    回复
- 否子戈 2020-05-23 17:55
  
  看到你所说的“等效于：{a:a}”这句话，已经做了修改，确实会让人误解，谢谢指出
  
  回复
阿川先生 2018-01-16 11:54

寫得很好！謝謝您的分享！

回复
- 否子戈 2018-01-19 08:32
  
  多交流
  
  回复
你扛我输出 2017-10-17 20:57

写的很好

回复
aaaaaaaaa 2017-09-07 18:32

var b = myModule;\na(); 这里a undefined

回复
- 否子戈 2017-09-07 19:51
  
  谢谢指出
  
  回复

唐霜

就算遇到ES6和Node中module的坑，也要承认世界将是JavaScript的