47

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

4

5 回答 5

37

它支持：

  • Safari 10.1
  • 铬 61
  • Firefox 54 – 在 about:config 中的 dom.moduleScripts.enabled 设置后面。
  • 边缘 16
于 2017-05-20T13:14:08.423 回答
17

Chrome 和 Firefox 支持import和export语法（存在正确 解析的测试）。

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

于 2016-08-01T15:27:11.933 回答
7

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

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

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

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

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

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

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

import { sum } from './math';

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

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

于 2017-01-27T14:55:18.827 回答
5

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

我在 Chrome 上成功测试了它。

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

它也在Edge 14 中原生实现：

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

于 2016-09-24T11:17:05.913 回答
2

根据谷歌的 Javascript 风格指南：

不要使用 ES6 模块（即exportandimport关键字），因为它们的语义还没有最终确定。请注意，一旦语义完全标准，将重新访问此策略。

// 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 Compiler、Babel 或 Rollup。

于 2018-04-09T16:40:25.200 回答