我使用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指定为应用程序中的顶级依赖项。
因此，您需要在"core-js": "^2.5.7"中依赖package.json，然后您需要确保将代码捆绑到您的应用程序中。
@ babel / polyfill已被弃用，因此请使用以下两个，
npm i --save core-js regenerator-runtime
然后删除import "@babel/polyfill";
并添加这两个
import "core-js/stable";
import "regenerator-runtime/runtime";
如此处所述