如何使用uglify版本webpack React.js

Question

我想使用uglify版本

对我的React.js应用进行webpack

webpack.config.js

module.exports = {
    entry: './_react/index',
    output: {
        path: './dist/public/app',
        filename: 'bundle.min.js'
    },
    devtool: 'source-map',
    devServer: {
        contentBase: __dirname
    },
    module: {
        loaders: [{
            test: /\.js?$/,
            exclude: /(node_modules|bower_components)/,
            loader: ['babel-loader'],
            query: {
                presets: ['es2015', 'react']
            }
        }]
    }
}

终端

webpack -p

在网络浏览器上预览后，我收到了此错误

请指导，谢谢

Answer 1

您需要将NODE_ENV设置为生产。来自React site：

  

注意：默认情况下，React将处​​于开发模式。要在生产模式下使用React，请将环境变量NODE_ENV设置为production（使用envify或webpack＆＃39的DefinePlugin）。

Answer 2

正如jmargolisvt所说，你需要设置NODE_ENV。

尝试使用以下内容更新您的webpack.config.js：

chicken = None
if joke in ['yes', 'ya', 'sure', 'ok', 'fine', 'yeah']:
    chicken = input("Why did the chicken cross the road?\n")
if chicken in ["To get to the other side", "to get to the other side"]:
    print("HAHAHAHAHAHHAHH OMG LOLZZZ FUNNY JOKE RIGHT!!!!!!!")

或者在您当前的配置中：

plugins: [
   new webpack.DefinePlugin({
     'process.env': {
       'NODE_ENV': JSON.stringify('production')
     }
   })
],

确保使用module.exports = { entry: './_react/index', output: { path: './dist/public/app', filename: 'bundle.min.js' }, devtool: 'source-map', devServer: { contentBase: __dirname }, module: { loaders: [{ test: /\.js?$/, exclude: /(node_modules|bower_components)/, loader: ['babel-loader'], query: { presets: ['es2015', 'react'] } }] } plugins: [ new webpack.DefinePlugin({ 'process.env': { 'NODE_ENV': JSON.stringify('production') } }) ], } 插入字符串而不是变量JSON.stringify