javascript - 如何将 ES6、AMD 和 CJS 模块与 JSPM 和系统 js 一起使用？

Question

我正在尝试 JSPM，进而尝试系统 JS，因为我觉得在我的应用程序中使用 ES6 功能(例如模块)有很多值(value)。但是，我希望能够同时使用 CJS 和 AMD 管理我的模块。以下是我的主应用程序文件中的代码示例，我在其中尝试加载并运行 CJS 模块和 ES6 模块:

//CJS
var cjsmodule = require('./modules/cjs-module');
var cjs = cjsmodule();
cjs.init();

//ES6
import { square } from './modules/es6-module';
console.log(square(11));

但我收到错误

Potentially unhandled rejection [2] TypeError: require is not a function 

如果我只使用一种方法，应用程序运行时不会出现错误。有谁知道是否可以使用 JSPM 将 ES6、CJS 和 AMD 一起存在于同一个应用程序中？

如果做不到这一点，有人可以推荐一个同时支持所有三种方法的替代模块加载器库吗？

Answer 1

这是一个老问题，但我在尝试弄清楚如何使用几个不同模块样式的包时发现了它。希望这个答案能够节省某人的时间。

JSPM 可以处理多种格式的包:CommonJS、AMD、ECMA2016 模块和全局。当你安装你的包时，你可以指定一个覆盖来告诉 JSPM 如何加载你的包，例如jspm install npm:your-mad-package-name-here -o "{format: 'cjs|amd|esm|global'}" 其中单引号中的值对应于包裹。使用包公开的类型只需导入它们即可，import typeNameHere from "your-amd-package-name-here";其中 typeNameHere 对应于默认或导出的类型。 (根据模块类型、公开的内容以及您想要使用的内容，导入内容可能会有一些学习曲线。)