将类与 webpack2 进行比较并做出反应答案

【问题标题】：comparing classes with webpack2 and react将类与 webpack2 进行比较并做出反应
【发布时间】：2017-10-08 06:55:22
【问题描述】：

在升级到 webpack 2 之前，我可以执行以下操作：

   children: PropTypes.arrayOf((propValue, key) => {
      const type = propValue[key].type
      if (type !== Column && type !== ColumnGroup) {
        throw new Error('<Table> can only have <Column> and <ColumnGroup> as children.')
      }
    })

这似乎不再适用于使用 webpack 2。错误总是被抛出。使用 webpack 2 比较反应类的正确方法是什么？

这是我的.babelrc

{
  "presets": [
    ["es2015", {"modules": false}],
    "react"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread",
    "react-hot-loader/babel"
  ]
}

更新：

这与将 NODE_ENV 设置为与生产以外的值有关。我可以在这里重现：https://github.com/dadamssg/react-class-bug/tree/master

【问题讨论】：

你在使用某种缩小器吗？
没有。不过，我正在使用 CommonsChunkPlugin。也许这与它有关？
我不这么认为。你使用的是哪个版本的 React？
我有 "^15.3.1" 用于 react 和 react-dom 并且做了一个 npm 缓存清理和安装，所以无论最新的是什么。
我已经接近弄清楚了。如果我在构建时没有明确设置 NODE_ENV，问题就会消失。虽然不太确定从这里去哪里。

标签： reactjs webpack webpack-2

【解决方案1】：

显然这是由 react hot loader 引起的已知问题。

https://github.com/facebook/react/issues/9652

我通过在组件类上添加我自己的静态变量并进行比较来解决它。

   children: PropTypes.arrayOf((propValue, key) => {
      const {_componentClass} = propValue[key].type
      if (_componentClass !== Column._componentClass && _componentClass !== ColumnGroup._componentClass) {
        throw new Error('<Table> can only have <Column> and <ColumnGroup> as children.')
      }
    })

不理想，但可以。

【讨论】：