IT技术 - react Webpack 生产错误 - 吾爱随笔录

我正在尝试为 React (15.3.2) 应用程序设置 webpack (1.13.3) 配置，并且我希望在我的生产版本中使用 React 的生产版本。我在 Windows 上。

我正在使用这个（当你搜索时它在网上随处可见）：

new webpack.ProvidePlugin({
  'process.env': {
    'NODE_ENV': JSON.stringify('production')
  }
})

但是，一旦我添加了这个并运行webpack（CLI），我就会因为很多错误而被打脸。

我收到一大堆这些警告：

警告 ./~/fbjs/lib/partitionObject.js.flow module解析失败：C:\node\sandbox\react-webpack\node_modules\fbjs\lib[这里有一些文件名].flow 意外令牌 (18:24)您可能需要一个合适的加载器来处理这种文件类型。

...和一堆这些错误：

./~/react/lib/NativeMethodsMixin.js module中的错误未找到：错误：无法解析 C:\node\sandbox\react-webpack\node_modules\react\lib @ 中的module“react-native/lib/TextInputState”。 /~/react/lib/NativeMethodsMixin.js 17:21-63

我没有使用 React Native，我不知道如何使用。

我也在webpack.optimize.UglifyJsPlugin我的webpack.config.production.js文件中使用。

当我删除该webpack.ProvidePlugin位时，构建工作，但包括 React 的开发版本，我在控制台中收到警告：

警告：看起来您正在使用 React 开发版本的缩小副本。将 React 应用程序部署到生产环境时，请确保使用跳过开发警告且速度更快的生产版本。

这些 webpack 错误是关于什么的..？我如何获得 React 的生产版本，它也被缩小了..？

更新

请求完整的 webpack 配置。我为此设置了一个测试应用程序，配置最少，但仍然显示警告和错误：

webpack.config.js

module.exports = process.env.NODE_ENV === 'production' ? require('./webpack.config.production.js') : require('./webpack.config.development.js')

webpack.config.base.js

module.exports = {
  entry: {
    'bundle': './client/index.js'
  },
  output: {
    path: './public',
    filename: 'js/[name].js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-loader',
        query: { presets: ['es2015', 'react'] }
      }
    ]
  }
}

webpack.config.development.js

var config = require('./webpack.config.base')
module.exports = config

webpack.config.production.js

var webpack = require('webpack')

var config = require('./webpack.config.base')

config.plugins = [
  new webpack.ProvidePlugin({
    'process.env': {
      'NODE_ENV': JSON.stringify('production')
    }
  }),
  new webpack.optimize.UglifyJsPlugin({
    include: /\.js$/,
    compress: { warnings: false }
  })
]

module.exports = config

我使用的测试应用程序只安装了以下内容：

"dependencies": {
  "express": "^4.14.0",
  "react": "^15.3.2",
  "react-dom": "^15.3.2"
},
"devDependencies": {
  "babel": "^6.5.2",
  "babel-core": "^6.18.2",
  "babel-loader": "^6.2.7",
  "babel-preset-es2015": "^6.18.0",
  "babel-preset-react": "^6.16.0",
  "webpack": "^1.13.3"
}

/客户端/index.js

import React from 'react'
import ReactDOM from 'react-dom'
import Hello from '../components/Hello'
ReactDOM.render(<Hello />, document.getElementById('page'))

/组件/Hello.js

import React from 'react'
const Hello = props => <p>Hello world...</p>
export default Hello

在一个单独的问题中再次询问，但有完整的错误列表，并从 React Native 视图，因为错误包含对 React Native 的引用，即使我没有尝试使用它：

生产中的 Webpack：为什么 React Native 错误？