es6模块化在项目中

浏览器里面使用模块化的方式：

首先创建一个app.js文件，这个文件作为总的js文件的入口，然后在这个app.js文件里面引入其它的模块。（但是要在我们的页面里面输入script标签，并且将其type设置为module）

es6模块化代码，在项目中的使用方式：

在项目中不会直接向之前的方式去引入模块，而是使用Babel方式。
Babel是一个javascript编译器，能够将es6的语法转化为es5能够使用的。
流程：
新建一个home.html文件，安装工具：babel-cil babel-preset-env browserify(项目中使用webpack)
npm init //进行初始化

npm install babel-cli babel-preset-env browserify -D //-D标识开发依赖

如果是局部安装使用:
npx babel 参数 -d dist/js —presets=babel-preset-env
//这个参数就是我们想要转化的文件目录
//-d表示我们要将转换完的结果存入那个文件夹下面
//dist/js为转化后的存储位置
//—presets=babel-preset-env （这个可以做配置文件）

然后就会生成一个dist文件夹，里面是转化后的文件，以及一个node_module文件夹。
我们要在home.html文件引入还需要进行一个打包的流程：
npx browserify dist/js/app.js -o dist/bundle.js1 //app.js表示js总接口文件

然后在home.html里面，script标签里面地址，src=dist/bundle.js

如果我们修改了es6源模块，就需要去重新转化重新打包。

经过验证发现：使用babel之后，一个js文件接口，引入多个模块不会出现没使用babel之前出现的问题。，