如何让浏览器支持ES6中的import和export语法

我们都知道现在浏览器对于ES2015(ES6)的语法支持还不是很强, 即便是使用Firefox和Chrome浏览器, 如果版本比较低的话, 可能还只能支持一部分语法, 因此想要使得开发人员编写出来的ES6语法能够正常地在各个浏览器运行的话, 还是需要将编写的JS文件通过一些工具编译成ES5语法才行, 那么这个工具就是babe。

然而, Babel默认只转换新的JavaScript句法（syntax），而不转换新的API，比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象，以及一些定义在全局对象上的方法（比如Object.assign）都不会转码。而且像import和export这两个命令现在在任何浏览器中都是不支持的, 同时babel也无法将其转换为浏览器支持的ES5, 原因在于:

所以我在这里讲解一下如何让import和export语法在浏览器中跑起来：

1.第一种方法很简单，只需要在创建<script type="module"></script> ，加入type=module的属性。

2.使用webpack进行打包，转换语法。