commonjs - 如何通过 Webpack 和 6to5 使用带有 es6 模块的 npm 包？

Question

假设我想在我的项目（或任何给定的 npm 包）中使用 Immutable。我已经npm install编辑了它，所以它在node_modules. 当然，那里有 CommonJS 导出。但是，我想在我的项目中使用 es6 模块。

我正在使用 Webpack 将它们一起编译，并使用 6to5-loader 来处理 es6 模块语法。

在我的源文件中，我说import Immutable from 'immutable';--- 但这会导致问题，因为 es6import正在寻找default已导出的 es6，但事实并非如此（对于 Immutable 或几乎任何其他 npm 包）。编译后的代码最终看起来像这样：var Immutable = require('immutable')["default"];--- 这当然会引发错误，因为没有default要查找的属性。

我可以使用带有 es6 模块的 npm 包吗？

Answer 1

Babel.js贡献者在这里。您正在寻找以下内容：

import * as Immutable from 'immutable';
// compiles to:
var Immutable = require('immutable');

互动演示

注意：这是使用commonor commonInteropmodules 选项。对于其他人，请参阅：https ://babeljs.io/docs/usage/modules/

Answer 2

刚刚想通了。（解决方案是特定于工具的——但 es6 模块现在只存在于它们启用工具的情况下，所以我认为这已经足够“答案”了。）

6to5 的默认模块转译使用该common选项，这导致了我在上面抱怨的问题。但是还有另一种选择：commonInterop--- 它必须是为了准确处理我正在处理的情况而构建的。见https://6to5.github.io/modules.html#common-interop

因此，为 6to5 欢呼三声。