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

Question

我目前正在使用 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

Answer 1

Chrome 和 Firefox 支持 import 和 export 语法（存在 proper parsing 的测试）。

不支持模块加载 - 您无法以任何方式加载模块，因为它的规范不完整。为此，您必须使用某种模块捆绑器。我不是前端开发人员，但我从同事那里听到了对 Rollup 的好评。

Answer 2

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

我在 Chrome 上测试成功。

这是link：http://github.com/ModuleLoader/browser-es-module-loader

它也在 Edge 14:

中本地实现

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

Answer 3

正如其他人所说，对它的支持仍然非常有限。但即使有全力支持……使用它是否明智？我们该怎么做？

想一想。使用 Node JS 模块编写的典型 JS 应用程序很容易包含数十个，甚至数百个（非常小的）包。我们真的需要那么多请求吗？

Browserify、Webpack、Rollup 等非常受欢迎，因为它们允许我们将许多小包捆绑到一个快速下载中。使用 code splitting 我们可以让模块打包器在转译时根据页面实际使用的代码和一些配置设置来决定要创建多少个包以及在每个包中放入什么。这样我们就可以编写许多小包并将它们作为（一对）大包提供。

我的观点是，我们应该将我们的代码分成在概念层面上运行良好的包，然后将这些包打包成在技术（网络）层面上运行良好的包。如果我们根据最佳网络数据包大小编写代码，我们最终会牺牲流程中的模块化。

与此同时，使用它可能只会增加混乱。比如看Edge博客上的例子：

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

请注意他们如何将扩展名 .js 添加到 from 字符串？在 Node JS 中我们通常这样写：

import { sum } from './math';

那么上面的代码是否也适用于 Edge？那么命名包呢？我担心在我们弄清楚如何使这些路径全面工作之前，我们会在这里看到很多不兼容的地方。

我敢猜测，对于大多数开发人员来说，System.import 在浏览器中基本上是不可见的，只有捆绑软件本身会在它成为主流时开始使用它（出于效率目的）。

Answer 4

它受支持：

野生动物园 10.1
Chrome 61
Firefox 54 – 在 about:config 中的 dom.moduleScripts.enabled 设置之后。
边 16

Answer 5

根据Google's Javascript Style Guide：

Do not use ES6 modules yet (i.e. the export and import keywords), as their semantics are not yet finalized. Note that this policy will be revisited once the semantics are fully-standard.

// Don't do this kind of thing yet:
//------ lib.js ------
export function square(x) {
    return x * x;
}
export function diag(x, y) {
    return sqrt(square(x) + square(y));
}

//------ main.js ------
import { square, diag } from 'lib';

但是，import 和 export 已在许多转译器中实现，例如 Traceur 编译器、Babel 或 Rollup。

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

Which browsers support import and export syntax for ECMAScript 6?

javascript

browser-support

ecmascript-6

es6-module-loader

es6-modules