CommonJS和ES Module 的区别

最近开始接触web编程，一上来就看到一堆关于module 的信息， commomJS module 和 ES module 直接给我看懵了。网上搜一下，总结一下。

大概意思就是CommonJS 先出现，用在nodejs 编程中。这玩意在浏览器中支持的不太好，随着时间的推移浏览器代码也需要模块化呀，于是 ES module 就出现了。

ES module 逐渐强大，大有一统天下的趋势，于是最新的nodejs 中也开始支持 ES module.

说了演变历史，在再说一下具体的区别：

CommonJs module：

• 一次只能导出一个变量；
• 在nodejs 中使用；
• 用require 语句调用

 

ES modules:

• 一次可以导出多个变量；
• 在浏览器中使用；
• 用import 语句导入；

这些区别在 前端的导入导出：「CommonJS」「ES Module」模块化规范 - 掘金 (juejin.cn) 这个文章中讲的很好。

 

既然有这两个模块，那html是否可以调用CommonJs 模块呢，又如何调用呢；

参考文件 ：ES6和commonJs模块化规范的混用_webpack能不能同时输出commonjs和es规范的文件-CSDN博客

越来越多的模块同时发布成支持commonJS 和ES6 规范的文件； 在package.json 中:

{
    "main": "aaa.js",
    "module": "aaa.module.js"
}

如果使用require，那么它就用aaa.js，如果你用import，那么它就用aaa.module.js；