未捕获的 ReferenceError：Webpack 代码拆分后未定义导出

Question

我试图通过将它分成两个包来优化我的 webpack 包大小：webpack-bundle.js，它包含我的代码，以及vendor-bundle.js，它包含节点模块和第三方库。但是在我成功创建两个包之后，我在浏览器中收到两个关于这两个包的错误：

Uncaught ReferenceError: exports is not defined at vendor-bundle.self-879f615019647c756dc959f99d735b3a2534b00805364ae6fca0091d1190d62d.js?body=1:1

Uncaught TypeError: Cannot read property 'call' of undefined at I (webpack-bundle.self-78221fc03008c178fe970b69731594f14d651dab84e5cf928beacc805ebde79c.js?body=1:1)

这是我的.babelrc：

{

  "plugins": [

    "@babel/plugin-proposal-class-properties",

    ["@babel/plugin-proposal-decorators", {"legacy": true}],

    "@babel/plugin-proposal-export-namespace-from",

    "@babel/plugin-proposal-function-sent",

    "@babel/plugin-proposal-json-strings",

    "@babel/plugin-proposal-numeric-separator",

    "@babel/plugin-proposal-object-rest-spread",

    "@babel/plugin-proposal-throw-expressions",

    "@babel/plugin-syntax-dynamic-import",

    "@babel/plugin-syntax-import-meta",

    "@babel/plugin-transform-react-jsx"

  ],

  "presets": [

    "@babel/preset-env",

    "@babel/preset-react"

  ]

}

我们使用 React、Rails、React on Rails 和 Slim。要加载 webpack，我会将其添加到我的application.slim：

  = javascript_include_tag 'vendor-bundle'

  = javascript_include_tag 'webpack-bundle'

我希望能够为我创建的两个捆绑包提供服务。我配置 webpack 和拆分包的方式有什么问题吗？还是我应该安装其他东西？

Answer 1

在 webpack 配置的底部，您将目标模式设置为 node在节点，module并module.exports同时存在，但这些并不在浏览器中存在的-这是什么导致错误如果您删除此行，webpack 将假定您的目标是浏览器，并且还会为您转换此行 - 然后您的包应该按预期在浏览器中运行。