Babel useBuiltIns:'usage',使用core-js 3失败

问题描述 投票:0回答:1

我最近开始使用Webpack,并且在与Babel和Core js(v3)设置相关的构建中遇到错误。

我得到的错误如下:找不到模块:错误:无法解析“ C:\ path \”中的“ core-js / modules / es.string.replace” @ file.jsx

这是在React项目上,而我要使用的功能在我的jsx组件之一上。

我的package.json看起来像这样:

    "devDependencies": {
        "@babel/cli": "^7.8.4",
        "@babel/core": "^7.9.6",
        "@babel/plugin-proposal-class-properties": "^7.8.3",
        "@babel/preset-env": "^7.9.6",
        "@babel/preset-react": "^7.9.4",
        "@babel/preset-typescript": "^7.9.0",
        "@babel/runtime-corejs3": "^7.10.1",
        "autoprefixer": "^9.8.0",
        "babel-loader": "^8.1.0",
        "core-js": "^3.6.5",
        "css-loader": "^3.5.3",
        "cssnano": "^4.1.10",
        "less-loader": "^6.1.0",
        "mini-css-extract-plugin": "^0.9.0",
        "node-sass": "^4.14.1",
        "optimize-css-assets-webpack-plugin": "^5.0.3",
        "postcss-loader": "^3.0.0",
        "resolve-url-loader": "^3.1.1",
        "sass-loader": "^8.0.2",
        "terser-webpack-plugin": "^3.0.1",
        "webpack": "^4.43.0",
        "webpack-cli": "^3.3.11",
        "webpack-manifest-plugin": "^2.2.0",
        "webpack-merge": "^4.2.2"
    },
    "dependencies": {
        "@babel/polyfill": "^7.8.7",
        "clean-webpack-plugin": "^3.0.0",
        "react": "^16.13.1",
        "react-dom": "^16.13.1",
        "regenerator-runtime": "^0.13.5"
    }

而且我的babel设置看起来像这样:

    test: /(\.jsx|\.js|\.ts|\.tsx)$/,
        exclude: /(node_modules)/,
        use: {
            loader: 'babel-loader',
            options: {
                cacheDirectory: true,
                sourceType: 'unambiguous',
                presets: [
                    [
                        '@babel/preset-env', {
                            modules: false,
                            corejs:  {
                                version: 3.6,
                                proposals: true
                            },
                            useBuiltIns: 'usage',
                            targets: {
                                browsers: browserList,
                            },
                        }
                    ],
                    '@babel/preset-typescript',
                    '@babel/preset-react'
                ],
                plugins: [
                    '@babel/plugin-proposal-class-properties'
                ],
            },
        },

在搜索中,我遇到了很多遇到类似问题的人,但是我还没有找到解决问题的方法。

webpack babel core-js
1个回答
0
投票

经过几天的寻找此问题的答案之后,我终于在堆栈溢出帖子上偶然发现了一个答案:https://stackoverflow.com/a/61446111/1820888-这是我的确切问题。在这里为遇到此问题的任何人解释答案:

我的文件结构非常复杂-正在转译的脚本文件完全不在我的捆绑软件设置范围之内。

[添加以下设置解决了该错误-它明确定义了node_modules包在项目上的位置,因此无论文件位于文件结构中的什么位置,它们都可以解释node_modules:

module.exports = {  
    resolve: {
      modules: [
        path.resolve(__dirname, "node_modules")
      ],
  ...
© www.soinside.com 2019 - 2024. All rights reserved.