ES6的module无法浏览器测试
今天学习module的export和import,可是用浏览器打开就提示错误。
我使用babel转换了一下,看到把import转成了require,可是目前浏览器不支持require方法。
搜索了一下怎么为什么不支持,看到一个感觉比较中肯的解答:
浏览器端的模块系统无法使用,不只是 require,即使 es6 标准中的 import 也无法支持。
原因在于目前模块之间依赖树的处理方法上还有一个明显的难题没有解决:
因为只有在浏览器完全下载完一个 js 文件,并且宿主引擎解析到 require 或 import 这些关键字的时候,才知道还有依赖需要下载并解析。然而该文件依赖的这个模块可能还依赖于其他模块,理论上依赖树可以有无限长,目前这种依赖的同步加载方式无疑会带来严重的进程阻塞和极高的网络开销。
目前并没有很好的解决方案使浏览器端自然地使用各个模块系统,只能使用 webpack 等工具预先将所有依赖打包,最终在浏览器环境中运行。