commonjs规范 webpack配置走的就是commonJS规范(node)在浏览器里边没办法运行依赖于node环境(node就是一个JS在服务器上的运行环境) require module.exports
cd到文件下可以看到控制台的输出:
esmodule 业务代码 JavaScript没有模块化一直是它的痛点,所以才会产生我们前面学习的社区规范:CommonJS、AMD、CMD等,所以在ES推出自己的模块化系统时,大家也是兴奋异常。
ES Module和CommonJS的模块化有一些不同之处:
- 一方面它使用了import和export关键字;
- 另一方面它采用编译期的静态分析,并且也加入了动态引用的方式;
ES Module模块采用export和import关键字来实现模块化:
- export负责将模块内的内容导出;
- import负责从其他模块导入内容;
注意:Module模块采用export和import关键字来实现模块化:
export导出和import导入的方式
1.export导出的几种方式
- 1.变量在声明时直接导出,即export后跟变量声明语句
- 2.变量声明后,统一导出
- 3.统一导出时给导出的变量起别名
1.变量在声明时直接导出,即export后跟变量声明语句
2.变量声明后,统一导出
3.统一导出时给导出的变量起别名
导入时要导入变量起的别名
4.export default 默认导出
还有一种导出叫做默认导出(default export)
- 默认导出export时可以不需要指定名字;
- 在导入时不需要使用 {},并且可以自己来指定名字;
- 它也方便我们和现有的CommonJS等规范相互操作;
- 默认导出只能有一个
导入时直接导入即可
2.import导入的几种方式:
- 1,具名导入 import { LName, LAge, LSum, LPerson } from "./a.js";
- 2,导入时变量起别名 import {name as LName} from "./a.js";
- 3,整体导入 import * as ll from "./a.js"
- 4,导入模块默认导入的变量