Я использую 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>
Редактировать: я не смог исправить эту проблему и перешел в Webpack с Babel без SystemJS.Однако я все еще заинтересован в решении.