javascript - React 应用程序编译但控制台中出现错误

Question

我刚刚开始使用 webpack 构建 React.js 应用程序，虽然代码编译良好，但我得到:

Uncaught TypeError: Cannot read property 'array' of undefined
at Object.<anonymous> (RoutingContext.js:28)

在浏览器控制台中。我什至不知道从哪里开始解决这个问题。

RoutingContext位于react-router自己的代码中，而不是我的，特别是这部分:

var _React$PropTypes = _react2['default'].PropTypes;
var array = _React$PropTypes.array;
var func = _React$PropTypes.func;
var object = _React$PropTypes.object;

我认为导致问题的代码是:

render((
  <Router history={hashHistory}>
    <Route path="/" component={App}>
      <Route path="adverts" name="adverts" component={Adverts}></Route>
      <Route path="ads" name="ads" component={Adverts}></Route>
    </Route>
  </Router>
), document.getElementById('root'));

webpack 配置:

var debug = process.env.NODE_ENV !== "production";
var webpack = require('webpack');
var path = require('path');

module.exports = {
  context: path.join(__dirname, "src"),
  devtool: debug ? "inline-sourcemap" : null,
  entry: ["babel-polyfill", "./index.js"],
  module: {
    rules: [
        { test: /\.json$/, loader: 'json-loader' }
      ],
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: {
          presets: ['react', 'es2015', 'stage-0'],
          plugins: ['react-html-attrs', 'transform-class-properties', 'transform-decorators-legacy'],
        }
      },
      {
        test: /\.css$/,
        include: /node_modules/,
        loaders: ['style-loader', 'css-loader'],
      }
    ]
  },
  output: {
    path: __dirname + "/src/",
    filename: "index.min.js"
  },
  plugins: debug ? [] : [
    new webpack.IgnorePlugin(/(locale)/, /node_modules.+(momentjs)/),
    new webpack.optimize.DedupePlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({ mangle: false, sourcemap: false }),
  ],
};

Answer 1

当您在应用程序中使用 React 16 时，您可能正在使用旧版本的 React-router 以及 React 15 的对等依赖项。 React 16 从主包中删除了 PropTypes，看起来 React-router 正在期待它。更新 react 路由器。