问题标签 [es6-module-loader]

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

在之前阅读本文时，我遇到了以下代码行：

这导致我提出以下问题：

• @如果有的话，这个符号的意义是什么？
• import 'foo/bar'和有区别import '@foo/bar'吗？

它是一种解决特定类型模块的方法吗？

我对 ES6 比较陌生，尽管import语法对我来说似乎很简单——除了在这种情况下，@符号的神秘存在。

我尝试使用谷歌搜索，但在 Stack Overflow、 MDN或其他地方找不到任何信息。

我使用 babel.js 并在我的代码中有一个新模块 foo

foo.js：

还有一堆大的旧文件，其中的一切都是全球性的。我需要从该遗留代码中调用一个 foo 函数。

bar.js：

但我不能只导入 foo 因为我的 bar.js 将是一个模块，并且无法从其他旧代码中获取。有没有办法导入模块并保留我的 bar.js 全局？

所以在我开始关注之前，先简单介绍一下环境

1. IDE：Webstorm，最新版本
2. es6 已安装并启用
3. 安装了通天塔。babel 文件观察器已安装
4. 打字稿已安装

我想做的是创建一个模块，然后将其导入并使用，但是我总是遇到不同的错误。以下是我拥有的文件列表及其内容

1. 员工.ts

   /li>

Webstorm 用以下错误强调了 Staf 这个词

2. 登录.js

   /li>

3. 登录.html

   /li>

当我尝试运行时，出现三个错误

现在我尝试安装 babel、babel-cli 和 babel-preset-es2015 但是注意到导致解决这个问题的突破

是否可以在下面的 switch case 示例语句中捕获拼写错误？

首选方法是 eslinter 报告警告/错误。如果未定义，当前添加toString()到const可用于在运行时引发。TypeError

actionTypes.js

减速器.js

更新：

正如@nikc.org 回答的那样，带有命名空间选项的 eslint-plugin-import可用于检查此类错误。

这是带有配置和演示的小型存储库：

https://github.com/bmihelac/test-js-import-undefined/tree/eslint-plugin-import

eslint 配置的相关部分是：

在 ES2015 中，可以将整个模块作为对象导入，其属性是模块的导出：

我发现这对于命名空间非常有用，并且一直使用它。

也可以重新导出其他模块的导出：

现在我正在尝试以这种风格编写一个具有命名空间的库。在顶层模块中收集所有内容的直观方式如下：

但这似乎不起作用；Babel 和 Rollup 都拒绝它。

我可以将模块作为对象导入，通过迭代其键创建一个克隆，然后导出它，但是它只是一个普通的旧动态对象，所以我会失去 Rollup 提供的巨大优势。

那么，使用声明性模块语法真的没有办法做到这一点吗？在我看来，这似乎没有任何借口。

我正在开发一个与(v6)Reflux捆绑在一起的 React & 应用程序，我遇到了 es6 模块依赖问题webpackbabel-loader

例如，我有一个使用回流.connect()mixin 的组件：

当我像这样在每个文件中单独导入所有模块时，一切都很好。

然后我尝试通过使用解构的导入语句来改进我的代码：

...在一个组件中：

...并在js/index.js：

应用程序源代码文件使用上述技术更加简洁，因为我可以在import一行中导入所有组件。

undefined但是当我使用它时，当我使用它们时，一些依赖项最终会出现

如果我使用相同的更新示例...

...MyStore参数undefined在Reflux.connect方法中结束。

我试图在调试器中进行故障排除，但我并不真正了解__webpack_require__(xxx)生成的包中的语句发生了什么。必须存在循环依赖，babel-loader或者 webpack 要求无法确定何时有index.js文件重新导出单个模块。

你知道有什么工具可以帮助我解决这个问题吗？我试过madge了，但它不适用于 es6 模块，我找不到任何可以告诉我哪里有问题的东西

嗨，在我的服务器上是这样工作的：

另一方面，它不是。相反，我必须使用：

两者都使用节点 4.2.2

谁能解释为什么？

我有一个名为的文件index.js，如下所示：

在我的index.html我有：

但令我困惑的是，我可以看到正在加载的文件（在开发工具网络面板中）但console.log从未运行过。如果是这种情况，我该如何引导我的应用程序？

一些在线教程建议在 System.import 文件中引导它，但如果不执行代码怎么办？

我们有一个 jspm config.js，其中包含以下设置：

这有效地允许我们使用更简洁的 import 语句，而不是必须删除相对路径。我们的目录结构如下所示：

所以在accounts.js中，我们不用写import Account from '../models/account'，而是写import Account from 'js/models/account'

我现在的问题是在 test/models/models.js 中，我import是不同的模型，使用它们正确的相对路径（即../../src/js/models/account）来测试它们，并且这些模型还包含它们自己的依赖项，它们使用有意义的路径导入给定 jspm 配置。发生的事情是“摩卡爆炸了！” 同时说模型正在导入无法找到的依赖项，因为它们依赖于 jspm 配置中找到的映射。

如何维护测试的 jspm 映射，以避免为了测试而必须设置每个被测试组件的相对路径？

我们使用 grunt 作为我们的构建工具，我目前正在使用 grunt-mocha-test 运行（即将成为）测试。