当我使用 webpack 和 React 16 捆绑我的应用程序时,我在浏览器中为 react 和 react-dom 收到“Uncaught ReferenceError: require is not defined”。导致错误的资源是 react.production.min.js 和 react-dom.production.min.js (来自 node_modules/react/cjs)。当我检查这些文件时,我清楚地看到了作为错误来源的“require”引用。React 15.6.2(或更低版本)不会发生这种情况,因为生产包没有任何 require 调用。似乎 webpack 没有转换这些文件,我不知道为什么不转换。我已经谷歌和谷歌,重新阅读了 webpack 文档,我只是空手而归。我确定这是一个基本的 webpack 配置问题,但我只是不明白。我正在使用 webpack 3.6.0。完全相同的项目适用于 React 15.6.2(这似乎是合理的,因为这些生产包没有任何 require 调用)。这只是我创建“生产”包时的问题。在“开发模式”中,我使用 react-hot-loader(版本 3.0.0-beta.7)并且没有问题。开发和生产 webpack 配置共享完全相同的 module.rules,即:
config.module.rules = [
// javascript
{
test: /\.jsx?$/,
use: 'babel-loader',
include: [path.join(__dirname, '../src/client'), path.join(__dirname, '../src/common')]
},
];
如何让 webpack 转换 react 生产文件?我很惊讶我是唯一遇到这种情况的人……但有时我觉得 webpack 对我的控制比我对它的控制要多。任何提示将不胜感激。