【JavaScript 模块化编程】CommonJS 模块化规范，ES6 模块化规范 导出导入与转码

前言：学习自：https://www.bilibili.com/video/BV1BU4y147pS?p=27

文章目录

• ​​一、CommonJS 模块化规范​​
• ​​二、ES6 模块化规范​​

• ​​1、导出导入​​

• ​​（1）依次导出导入​​
• ​​（2）一次导出导入​​

• ​​2、转码​​

一、CommonJS 模块化规范

每个文件就是一个模块。CommonJS规范规定，每个模块内部，module变量代表当前模块。这个变量是一个对象，它的exports属性（即module.exports）是对外的接口。加载某个模块，其实是加载该模块的module.exports属性。

导出：module.exports

导入：require

附加：​​一篇前辈的文章​

二、ES6 模块化规范

ES6使用 export 和 import 来导出、导入模块。

导出：export，export default
导入：import

1、导出导入

（1）依次导出导入

导出

导入

（2）一次导出导入

导出

导入

2、转码

报错，因为默认是不支持 ES6 语法的

需要用 Babel 来处理，使语法从 ES6 转换为 ES5

因此执行以下步骤：

1、初始化为 Node.js 项目

2、配置 .babelrc 文件

{
  "presets": ["es2015"],
  "plugins": []
}

3、安装转码器（作为 ES6 新语法到 ES5 语法的映射表），在项目中安装

cnpm install --save-dev babel-preset-es2015

4、自定义脚本，修改 package.json 文件中的 scripts 标签

5、执行上述自定义的 build

6、执行转码后的 js 文件