如何让引入es6的html文件运行起来？

编写js文件的时候我使用的是babel进行编译的。

首先我编写了一个util.js文件：

export default function (){
    xxxxx
}

然后在test文件引入util.js文件

import $ from 'util.js'

//xxxx其他操作

在HTML文件里面

xxx
<body>
    <script src='./dist/test.js'></script>    //这引入的是编译过后的文件
</body>
xxx

但是将这个HTML文件放到浏览器运行会报错。请问怎么才能让进行编译后的es6文件在html文件里面被浏览器运行呢？？？

不太清楚你的浏览器报了什么错…
大概讲一下平时的做法以及一些可能性出错的点吧。

一般分为两种
1.先编译后引入
这个需要使用Node提供一个服务，可以用babelcli做一个编译生成浏览器能识别的ES5文件，或者用webpack之类的编译生成，当然最终你要引入浏览器的是你编译后的文件。那你打开一下你的文件看看是不是编译过了。

还有看你其中讲到一点，就是你impot进来文件，babel应该会帮你编译成require()，但是在浏览器是没有这个方法的，所以一般会用webpack来打包，他会自己帮你做依赖加载把你的文件合并成一个。

2.引入后再编译
那你除了这两个文件外还需要一个babel 的编译器文件，然后后面引入的js文件需要指定type="text/babel"，具体可以看babel in browser

【热门文章】