React Build Fail:模块构建失败(来自./node_modules/babel-loader/lib/index.js):找不到模块'babel-core'

时间:2019-09-27 03:07:48

标签: reactjs webpack babel webpack-4 babel-jest

尝试使用Webpack4和Babel7构建React应用时,我遇到以下错误。

Error: Cannot find module 'babel-core'
[1]     at Function.Module._resolveFilename (module.js:547:15)
[1]     at Function.Module._load (module.js:474:25)
[1]     at Module.require (module.js:596:17)
[1]     at require (/Users/taelee/Desktop/fullstack-web-project/server-two/client/node_modules/webpack-cli/node_modules/v8-compile-cache/v8-compile-cache.js:161:20)

我尝试使用以下内容删除node_modules文件夹并重新安装依赖项。

我尝试安装不同版本的babel-loader,但是没有用。 babel软件包的版本似乎有问题。

这是我的Package.json:

"babel": {
    "presets": [
      "@babel/preset-react",
      "@babel/preset-env"
    ]
  },
  "dependencies": {
    "axios": "^0.19.0",
    "less": "^3.10.3",
    "materialize-css": "^1.0.0",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-redux": "^7.1.1",
    "react-router-dom": "^5.0.1",
    "react-scripts": "3.1.1",
    "redux": "^4.0.4",
    "redux-thunk": "^2.3.0"
  },
"devDependencies": {
    "@babel/core": "^7.6.2",
    "@babel/preset-env": "^7.6.2",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^7.0.6",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "babel-preset-stage-2": "^6.24.1",
    "css-loader": "^3.2.0",
    "less-loader": "^5.0.0",
    "style-loader": "^1.0.0",
    "webpack": "^4.39.1",
    "webpack-cli": "^3.3.9",
    "webpack-dev-server": "^3.2.1"
  }

这是我的webpack.config.js:

const path = require('path');

module.exports = {
  entry: './src/index.js',
  output: {
    path: path.resolve(__dirname, 'lib'),
    filename: 'index.js',
    libraryTarget: 'commonjs2'
  },
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: { loader: 'babel-loader' }
      },
      {
        test: /\.(?:le|c)ss$/,
        use: [
          require.resolve('style-loader'),
          {
            loader: require.resolve('css-loader'),
            options: {
              importLoaders: 1
            }
          },
          {
            loader: require.resolve('less-loader'),
            options: {
              importLoaders: 1
            }
          }
        ]
      }
    ]
  },
  externals: {
    'react': 'commonjs react'
  }
};

有人可以帮我解决这个问题吗?

0 个答案:

没有答案