Javascript 从web应用的Webpack 4捆绑包中排除节点_模块

我想做的是：

将我的node_模块从Webpack4（不仅仅是babel加载程序）捆绑中排除

我当前的生产捆绑包大小：

Version: webpack 4.42.0
Time: 34941ms
Built at: 09/23/2020 2:05:13 PM
             Asset      Size  Chunks                    Chunk Names
./public/bundle.js  4.87 MiB       0  [emitted]  [big]  bundle
Entrypoint bundle [big] = ./public/bundle.js

Version: webpack 4.42.0
Time: 10780ms
Built at: 09/23/2020 1:50:15 PM
                 Asset      Size  Chunks                   Chunk Names
    ./public/bundle.js  10.4 MiB  bundle  [emitted]        bundle
./public/bundle.js.map  11.2 MiB  bundle  [emitted] [dev]  bundle
Entrypoint bundle = ./public/bundle.js ./public/bundle.js.map

我当前的开发包大小：

Version: webpack 4.42.0
Time: 34941ms
Built at: 09/23/2020 2:05:13 PM
             Asset      Size  Chunks                    Chunk Names
./public/bundle.js  4.87 MiB       0  [emitted]  [big]  bundle
Entrypoint bundle [big] = ./public/bundle.js

Version: webpack 4.42.0
Time: 10780ms
Built at: 09/23/2020 1:50:15 PM
                 Asset      Size  Chunks                   Chunk Names
    ./public/bundle.js  10.4 MiB  bundle  [emitted]        bundle
./public/bundle.js.map  11.2 MiB  bundle  [emitted] [dev]  bundle
Entrypoint bundle = ./public/bundle.js ./public/bundle.js.map

据我所知，4.87 MiB和10.4 MiB对于一个Web包包包来说是巨大的

我当前的生产网页包配置：

'use strict'
const SpeedMeasurePlugin = require('speed-measure-webpack-plugin')
const smp = new SpeedMeasurePlugin()
const TerserPlugin = require('terser-webpack-plugin')

module.exports = smp.wrap({

  mode: 'production',
  entry: {
    'bundle': './client/index.js',
  },
  output: {
    path: __dirname,
    filename: './public/[name].js'
  },
  optimization: {
    minimizer: [new TerserPlugin({
      include: /\.js$/,
    })],
    minimize: true
  },
  context: __dirname,
  devtool: 'source-map',
  module: {
    rules: [
      {
        exclude: /(node_modules)/,
        loader: 'babel-loader',
        query: {
          presets: ['react', 'env']
        }
      },
      {
        test: /\.css$/,
        use: [ 'style-loader', 'css-loader' ]
      }
    ]
  }
})

我所尝试的：

• 使用网页包节点外部

这将成功排除节点_模块，但在我的应用程序中导致中断错误：

Uncaught ReferenceError: require is not defined
    at Object.react (external "react":1)
    at __webpack_require__ (bootstrap:19)
    at Object../client/index.js (index.js:1)
    at __webpack_require__ (bootstrap:19)
    at bootstrap:83
    at bootstrap:83

我已经读过了，这个webpack node externals包似乎不应该用于web应用程序。移除externals道具，并在“节点”和“web”之间切换目标不会成功排除我的节点\u模块

我注定要在这里吗？我是否只是拥有一个庞大的应用程序，并且不应该期望将捆绑包的大小从用于生产的4.87 MiB和用于开发的10.4 MiB进一步降低？根据我所读到的一切，它似乎非常大