哪些浏览器支持ECMAScript 6的导入和导出语法?

我目前正在使用MEAN Stack编写一个Web应用程序,并试图在ECMAScript 6 JavaScript中编写代码; 不过,在使用导入和导出语法时,我在Chrome和Firefox中都遇到了错误。 目前是否有任何浏览器完全支持ECMAScript 6?

请注意:我不问ECMAScript 6何时会被浏览器支持。 我在问哪些浏览器支持ECMAScript 6导入和导出语法。 请参阅https://developer.mozilla.org/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_6_support_in_Mozilla#Features_not_yet_supported_by_Firefox

Chrome和Firefox支持importexport语法(存在正确 parsing的testing)。

什么是不支持的是模块加载 – 你不能以任何方式加载模块,因为它的规范是不完整的。 你必须为此使用某种模块捆绑器。 我不是前端开发人员,但我从同事那里听到Rollup的好评。

它支持在:

  • Safari 10.1
  • Chrome 60 – 在Chrome:旗帜下的Experimental Web Platform标志后面。
  • Firefox 54 – 在about:config的dom.moduleScripts.enabled设置后面。
  • 边缘15 – 在about:标志后面的实验性JavaScriptfunction背后。

现在有一个pollyfill ,你可以用它来导入ES6模块。

我在Chrome上成功testing了它。

这里是链接: http : //github.com/ModuleLoader/browser-es-module-loader


它也在Edge 14本地实现:

https://blogs.windows.com/msedgedev/2016/05/17/es6-modules-and-beyond

正如其他人所说的,对它的支持仍然非常有限。 但即使有全力支持……使用它会很聪明吗? 我们将如何做到这一点?

想想看。 使用Node JS模块编写的典型的JS应用程序很容易包含数十个甚至数百个(非常小的)包。 我们真的想要这么多的要求吗?

Browserify,Webpack,Rollup等非常受欢迎,因为它们允许我们将许多小软件包捆绑成一个快速下载。 通过代码拆分,我们可以让模块打包器根据页面实际使用的代码以及某些configuration设置,在转发时间决定要创build多less个捆绑包,以及每个包含哪些内容。 这样我们可以写很多小包,并作为(几个)大包装服务。

我的观点是,我们应该将代码分成在概念层面上运行良好的软件包,然后将这些软件包捆绑到在技术(networking)层面上运行良好的软件包中。 如果我们根据最佳的networking数据包大小来编写代码,那么我们最终会牺牲模块化。

同时,使用它可能只会增加混淆。 例如,查看Edge博客上的示例:

 import { sum } from './math.js'; 

请注意他们如何将扩展名.js添加到fromstring? 在Node JS中,我们通常将其写为:

 import { sum } from './math'; 

那么上面的代码也能在Edge上工作吗? 那命名包呢? 我担心在我们弄清楚如何使这些path全面工作之前,我们会看到很多不兼容的地方。

我猜测对于大多数开发人员来说, System.import在浏览器中大部分都是不可见的,而且只有绑定软件本身才会开始使用(为了提高效率)。