ES6模块化

​ ES6模块化规范中定义：
​ 1).每一个js文件都是独立的模块
​ 2).导入模块成员使用import关键字
​ 3).暴露模块成员使用export关键字

ES6模块化是浏览器端和服务器端通用的规范.

在NodeJS中安装babel

  1. 安装babel，bable就是一个语法转换器，将高级的具有兼容性的js代码转为低级的没有兼容想性性js代码。
    打开终端，输入命令：​​​npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node​​​ 安装完毕之后，再次输入命令安装：​​npm install --save @babel/polyfill​​
  2. 创建babel.config.js
    在项目目录中创建babel.config.js文件。
    编辑js文件中的代码如下：
const presets = [
                ["@babel/env",{
                     targets:{
                       edge:"17",
                       firefox:"60",
                       chrome:"67",
                       safari:"11.1"
                      }
                }]
           ]
//暴露
module.exports = { presets }
  1. 创建index.js文件
    在项目目录中创建index.js文件作为入口文件
    在index.js中输入需要执行的js代码，例如：
    ​​​ console.log("ok");​​
  2. 使用npx执行文件
    打开终端，输入命令：​​​npx babel-node ./index.js​​

ES6基本语法设置默认导入/导出

默认导出

//当前文件模块 m1.js
//私有成员
let a =10;
let c=20;
let d=30;


function show(){}

//将本模块中的私有成员暴露出去，供其他模块使用
export default{
    a,
    c,
    show
}//没有向外暴露d，所以外界访问不到

默认导入

import 接收名称 from “模块标识符”，如下：

//导入模块
import m1 from "./m1.js"
cosole.log(m1);
//输出{a:10,c:20,show:[Function:show]}

注意：在一个模块中，只允许使用export default向外默认暴露一次成员，千万不要写多个export default。
如果在一个模块中没有向外暴露成员，其他模块引入该模块时将会得到一个空对象

设置按需导入/导出

按需导出

//当前文件m1.js

//向外按需导出变量s1
export  let s1="aaa"
//向外按需导出变量s2
export let s2 ="bbb"
//按需导出方法
export function say =function(){}

按需导入

​​import { num,fn as printFn ,myName } from "./test.js"​​​ 同时导入默认导出的成员以及按需导入的成员
​​import test,{ num,fn as printFn ,myName } from "./test.js"​​使用as起别名
注意：一个模块中既可以按需导入也可以默认导入，一个模块中既可以按需导出也可以默认导出

直接导入并执行代码

只想单纯执行某个模块中的代码，并不需要得到模块中向外暴露的成员。

​​ import "./test2.js";​​