Babel 6.x → 7.x
をアップグレードしましたが、実行中に問題が発生しましたWebpack。
core-js/modules/*
が見つからないという不満があります。
私のbabel.config.js
はルートディレクトリにあります。以前の.babelrc
をjsに変換しました(.babelrc
でも同じエラーが発生しました)。私はそれがすべてのコア、corejs2
、ランタイムのものとのいくつかの衝突だと思います。
私のsrcには、mineとStyleguidist(./node_modules
内)の2つのアプリがあります。私のアプリはこれらの同じpackage.json/babel.configをトランスパイリングして動作しますが、Styleguidistはそうではありません。
WebパックでStyleguidistを実行するときのエラー:
Module not found: Error: Can't resolve 'core-js/modules/es.array.concat' in '/project/src/node_modules/react-styleguidist/lib/client/rsg-components/Slot'
/node_modules/react-styleguidist/lib/client/rsg-components/Slot.js
:
import "core-js/modules/es.array.concat";
import "core-js/modules/es.array.filter";
...
"dependencies": {
"@babel/polyfill": "^7.0.0",
"@babel/runtime-corejs2": "^7.4.3",
}
"devDependencies": {
"@babel/core": "^7.4.3",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.4.3",
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/plugin-syntax-jsx": "^7.0.0",
"@babel/plugin-transform-modules-commonjs": "^7.4.3",
"@babel/plugin-transform-react-jsx": "^7.3.0",
"@babel/plugin-transform-runtime": "^7.4.3",
"@babel/preset-env": "^7.4.3",
"@babel/register": "^7.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-eslint": "^10.0.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-jest": "^24.7.1",
"babel-loader": "^8.0.0",
"babel-plugin-dynamic-import-node": "^2.2.0",
"babel-plugin-transform-vue-jsx": "^4.0.1",
}
module.exports = {
presets: ['@babel/preset-env'],
plugins: [
'@babel/plugin-transform-runtime',
'@babel/plugin-transform-react-jsx',
'transform-vue-jsx',
"@babel/plugin-proposal-object-rest-spread",
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-syntax-import-meta",
"@babel/plugin-proposal-class-properties",
"@babel/plugin-proposal-json-strings",
[
"@babel/plugin-proposal-decorators",
{
"legacy": true
}
],
"@babel/plugin-proposal-function-sent",
"@babel/plugin-proposal-export-namespace-from",
"@babel/plugin-proposal-numeric-separator",
"@babel/plugin-proposal-throw-expressions"],
comments: false
}
可能な答えを見つけました。このエラーを解決するには、core-jsバージョンを2.5.7にダウングレードできます。このバージョンでは、別個のES6フォルダーとES7フォルダーを使用して、正しいカタログ構造が作成されます。
バージョンをダウングレードするには、次のコマンドを実行します。
npm i -S [email protected]
私は同じ問題を抱えていましたが、しばしば、次のように別のパッケージをインストールするのを忘れました:
"@ babel/runtime-corejs3": "^ 7.5.5"、
問題が発生しているのと同じレベル(開発、ローカル、または本番)でインストールすることを忘れないでください。
npm i -D(or --save-dev) @babel/runtime-corejs3
したがって、一般に、この種のエラーは、バージョンに依存関係の更新の変更があり、以前のバージョンとの下位互換性がない場合に発生します。確かにcorejs3はcorejs2とまったく互換性がありません。