关于es6的模块化知识

121 阅读1分钟

关于es6的模块化知识

什么是模块化
一个js文件可以引入其他的js文件,能使用引入的js文件的中的变量、数据,这种特性就称为模块化。

在nodejs中搭建es6模块化环境 node.js 中默认支持 CommonJS 模块化规范,如果想基于 node.js 体验与学习 ES6 的模块化语法,需要按照如下两个步骤进行配置

  • 确保安装了 v13.0.0 或更高版本的 node.js
  • 在 package.json 的根节点中添加 "type": "module"节点

Snipaste_2022-05-01_19-41-56.png

注意: 配置之后,则只能使用ES6模块化语法,不能再使用CommonJS语法了

默认导入导出语法

默认导出的语法: export default 默认导出的成员
默认导入的语法: import 接收名称 from '模块路径

Snipaste_2022-05-01_19-46-12.png

  1. 每个模块中,只允许使用唯一的一次 export default
  2. 默认导入时的接收名称可以任意名称,只要是合法的成员名称即可 按需求导入导出 语法如下:

Snipaste_2022-05-01_19-51-04.png

  1. 每个模块中可以有多次按需导出
  2. 按需导入的成员名称必须和按需导出的名称保持一致
  3. 按需导入时,可以使用 as 关键字进行重命名

让浏览器支持es6模块化 只需要在html页面导入对应js时加入type="module"即可

Snipaste_2022-05-01_19-54-41.png