如何修复Module build failed及TypeError: Cannot read property 'has' of undefined错误

Hey there, let's tackle the two errors you're running into when starting your project locally. Based on your description and dependencies, here's a step-by-step breakdown to resolve them:

1. Resolve the TypeError: Cannot read property 'has' of undefined from babel-plugin-lodash #

This error is almost certainly due to an outdated babel-plugin-lodash version that's incompatible with your Babel 7 setup. Your current babel-plugin-lodash@3.3.2 was built for Babel 6, but you're using @babel/core@7.x. Here's how to fix it:

• Uninstall the old version:

  npm uninstall babel-plugin-lodash --save-dev
  

• Install the Babel 7-compatible version (v6+):

  npm install babel-plugin-lodash@^6.0.0 --save-dev
  

• Additionally, your lodash-webpack-plugin@0.11.2 is also quite old—you might want to upgrade that to ^0.11.6 (the latest for its major version) to avoid further compatibility issues:

  npm install lodash-webpack-plugin@^0.11.6 --save-dev
  

2. Fix the Module build failed (from ./node_modules/babel-loader/lib/index.js) Error & Babel Core Conflict #

The babel-core@^7.0.0-bridge.0 package is a compatibility layer for older tools that still expect Babel 6's babel-core instead of Babel 7's @babel/core. In your case, this is needed because babel-jest@23.4.2 (a Babel 6-era tool) depends on the old babel-core package. Here are two paths to resolve this:

Option A: Keep the bridge package (quick fix) #

If you don't want to upgrade all your Jest-related dependencies, you can keep the bridge but ensure all Babel packages are properly aligned:

• Double-check that babel-loader is compatible with @babel/core: Your babel-loader@8.2.2 works perfectly with @babel/core@7.12.9, so that's not the issue.
• Clear your dependency cache and reinstall:

  rm -rf node_modules package-lock.json
  npm install
  npx babel --clear-cache
  

Option B: Remove the bridge by upgrading Jest dependencies (cleaner long-term fix) #

Since you're already using jest@26.6.3, you can upgrade babel-jest to match this version (which natively supports Babel 7, eliminating the need for the bridge):

• Uninstall the old babel-jest and bridge package:

  npm uninstall babel-jest babel-core --save-dev
  

• Install the matching babel-jest version:

  npm install babel-jest@^26.6.3 --save-dev
  

• Reinstall dependencies and clear cache as above.

3. Verify Your Babel Configuration #

Make sure your .babelrc or babel.config.js is correctly set up for Babel 7. Here's a sample configuration that aligns with your dependencies:

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-transform-regenerator",
    "@babel/plugin-transform-runtime",
    "babel-plugin-lodash",
    "babel-plugin-dynamic-import-webpack"
  ]
}

After completing these steps, try starting your project again—both errors should be resolved. If you still run into issues, double-check that no other outdated Babel plugins are lurking in your dependencies (like older babel-eslint—you might want to upgrade that to @babel/eslint-parser eventually, but that's a separate tweak).

内容的提问来源于stack exchange，提问作者Dejan