我将 Babel 7 与 polyfill 和 systemjs 插件一起使用，这会导致以下错误：
Unhandled promise rejection Error: "Unable to resolve bare specifier "core-js/modules/web.dom.iterable" from file:///[...]/target/main.js"
我怎样才能告诉 Babel 生成可以在 SystemJS 中运行而不会出错的转译代码？
转译的代码如下所示：
"use strict";
System.register(["core-js/modules/web.dom.iterable", "core-js/modules/es6.set", "./loadGraphFromSparql.js", "./log.js", "./filter.js", "./menu.js", "./search.js", "./button.js", "./graph.js", "./file.js", "./rdfGraph.js", "./layout.js", "./progress.js"], function (_export, _context) {
"use strict";
package.json：
{
[...]
"dependencies": {
"@babel/polyfill": "^7.0.0",
"cytoscape": "^3.2.17",
"cytoscape-cxtmenu": "^3.0.1",
"cytoscape-euler": "^1.2.1",
"spin.js": "^4.0.0",
"systemjs": "^2.0.1"
},
"devDependencies": {
"@babel/cli": "^7.1.2",
"@babel/core": "^7.1.2",
"@babel/plugin-transform-modules-systemjs": "^7.0.0",
"@babel/preset-env": "^7.1.0",
"@babel/register": "^7.0.0",
"chai": "^4.2.0",
"docdash": "^1.0.0",
"es6-promise": "^4.2.5",
"eslint": "^5.6.1",
"eslint-plugin-import": "^2.14.0",
"isomorphic-fetch": "^2.2.1",
"jsdoc": "^3.5.5",
"mocha": "^5.2.0",
"node-localstorage": "^1.3.1"
},
[...]
"scripts":
{
"build": "babel js -d target", [...]
}
}
.babelrc
{
"presets":
[[
"@babel/preset-env", {
"targets": {
"chrome": 52,
"browsers": ["Firefox 49", "Edge 12","Chrome 53", "Opera 41", "Safari 10"]
},
"useBuiltIns": "usage"
}]],
"plugins": ["@babel/plugin-transform-modules-systemjs"]
}
编辑： 正如@loganfsmyth所建议的，我删除了对@babel-polyfill的依赖。我还添加了一个systemjs-packagemap来包含裸导入。不幸的是，这会导致以下错误：
Unhandled promise rejection Error: Error loading file:///.../myproject/node_modules/core-js/modules/web.dom.iterable from file:///.../myproject/target/main.js
Stack trace:
h.instantiate/</<@file:///.../myproject/node_modules/systemjs/dist/system.min.js:4:4817
core.min.js
似乎 system.js 忘记在文件末尾添加.js，因为 web.dom.iterable 存在。
相关的 HTML：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="node_modules/core-js/client/core.min.js"></script>
<script type="systemjs-packagemap">
{
"packages": {
"core-js":
{
"path": "./node_modules/core-js/",
"main": "client/core.min.js"
}
}
}
</script>
<script src="node_modules/systemjs/dist/s.min.js"></script>
<script src="node_modules/systemjs/dist/system.min.js"></script>
</head>
<body>
<script>
System.import("./target/main.js");
</script>
</body>
</html>
编辑：我无法解决这个问题，并转移到没有SystemJS的Babel的Webpack。但是，我仍然对解决方案感兴趣。
请参阅 Babel 的文档以了解preset-env的useBuiltins选项：https://babeljs.io/docs/en/babel-preset-env#usebuiltins
此选项将对 core-js 模块的直接引用添加为裸导入。因此，core-js 将相对于文件本身进行解析，并且需要可访问。如果没有 core-js 依赖项或有多个版本，则可能需要将 core-js@2 指定为应用程序中的顶级依赖项。
因此，您需要依赖于package.json中的"core-js": "^2.5.7"，然后需要确保将代码捆绑到应用程序中。
@babel/polyfill 已被弃用，因此请改用以下两个，
npm i --save core-js regenerator-runtime
然后删除import "@babel/polyfill";
并添加这两个
import "core-js/stable";
import "regenerator-runtime/runtime";
如此处所述
https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md