Webpack打包时ES6编写的npm包未被正确打包问题求助

Alright, let's break down why you're hitting this build error and walk through the fixes step by step.

The Root Cause #

Webpack 3 doesn't natively transpile ES6+ syntax from node_modules by default — it assumes packages there are already compiled to ES5. Your @ui/base package seems to have either:

• A misconfigured entry point (its package.json's main field isn't pointing to the correct build file at ui/base/target/package/@ui/base/0/Main.js), or
• Its build output is still in ES6, which Webpack 3 can't process without Babel.

Solution 1: Force Babel to Transpile @ui/base #

Update your Webpack config to tell babel-loader to process this specific package (since Webpack normally skips node_modules).

Modify your webpack.config.js's module.rules section:

module.exports = {
  // ... other config
  module: {
    rules: [
      {
        test: /\.js$/,
        // Exclude all node_modules EXCEPT @ui/base
        exclude: /node_modules(?!\/@ui\/base)/,
        loader: 'babel-loader',
        options: {
          // Use the preset your project already uses (es2015 or env)
          presets: ['es2015']
        }
      }
    ]
  }
};

Make sure you have the necessary Babel dependencies installed for Webpack 3:

npm install babel-loader@7 babel-core babel-preset-es2015 --save-dev

(Note: Webpack 3 works best with babel-loader@7; newer versions require Webpack 4+.)

Solution 2: Fix the Package Entry Point #

If the issue is that @ui/base's package.json doesn't point to the correct build file (Main.js), you can override its entry in Webpack with an alias:

Add this to your webpack.config.js:

const path = require('path');

module.exports = {
  // ... other config
  resolve: {
    alias: {
      '@ui/base': path.resolve(
        __dirname,
        'node_modules/@ui/base/target/package/@ui/base/0/Main.js'
      )
    }
  }
};

This ensures your import '@ui/base'; statement directly references the correct built file instead of relying on the package's default entry.

Solution 3: Verify the Package's Build Status #

If neither of the above works, double-check that the @ui/base package was actually built correctly. Sometimes build scripts fail silently, leaving uncompiled ES6 source code instead of the expected Main.js. You can manually check the file at node_modules/@ui/base/target/package/@ui/base/0/Main.js to confirm it's ES5-compatible.

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