Es6 写的文件import 起来解决方案详解

这段时间，学习了一点关于es6新规范的知识，而后心血来潮，想尝试一下用ES6编写的代码在浏览器中跑起来。

说干就干，先说下个人实现步骤（没想到有坑！）

1.把ES6代码转译成ES5;
2.html文件引入转译后的ES5;
3.而后在浏览器环境中运行;
4.在node环境中运行;

而后下面是个人一些目录结构，大体预览一下。

src，es6开发目录

dist，es5生产目录

test，一个测试目录

而后，看一下个人ES6开发的一些js是什么样子。

file1

file2

app

test

而后咱们在html中引入dist中的通过转译的文件

在浏览器中测试，test中由于没引入模块，因此正常执行，app中由于引入了模块，并且是CommonJS规范，可是浏览器不支持这种规范，所以报错

假如，咱们为了测验，就给html加上requireJS文件，浏览器支持AMD/CMD规范。异步加载定义。

可是，咱们发现，仍是会报错，说明语法不支持，或者二者冲突了，由于一种是AMD，一种是CommonJS。

因为咱们经过node来编译ES6成ES5，node模块就是参照CommonJS规范来的，因此ES5的语法，也属于CommonJS规范，并且如今的浏览器和node都不支持ES6的规范或大部分不支持。

解决方法

通过查阅资料，发现能够经过webpack打包工具来将依赖合并成一个文件，而后引入html中。

感谢阅读，但愿能帮助到你们，谢谢你们对本站的支持！