Question

我有以下webpack.config.js：

const nodeExternals = require('webpack-node-externals')

const jsLoader = {
  test: /\.js$/,
  loader: 'babel-loader',
  query: {
    presets: ['env', 'react'],
    plugins: ['babel-plugin-transform-object-rest-spread']
  }
}

const client = {
  entry: ['./app/client.js'],
  output: {
    path: '/public',
    publicPath: '/',
    filename: 'client.bundle.js'
  },
  externals: [nodeExternals()],
  module: {
     loaders: [jsLoader]
  }
}

module.exports = [client]

和结果client.bundle.js：

/******/ ([
/* 0 */
/***/ (function(module, exports) {

module.exports = require("react");

它在chrome中失败，因为Uncaught ReferenceError: require is not defined

在我client.js上，我正在导入react，react-dom，prop-types和一些反应组件。

为什么webpack（对于react和prop类型）执行require而不是像__webpack_require__那样执行其他需求？

React@16.2， Webpack@3.10 Node@8.4

谢谢，

Answer 1

所以，

正如Wostex所说，我的问题来自节点外部。

当我删除它时，npm build需要花费很长时间才能使用某些winston，fs，readMe文件等...

我正在使用的自定义记录器模块似乎导入了不适合浏览器的模块。所以我仍然使用外部，但删除此记录器。

为什么webpack为我的客户端代码创建require（'react'）

1 个答案: