Question

我尝试使用here中的解决方案，但图标仍然显示为开发模式。

这是我当前的文件，其中包含以下答案的更新：

const path = require('path');
const SRC_DIR = path.join(__dirname, '/client-react/src');
const DIST_DIR = path.join(__dirname, '/client-react/dist');
const webpack = require('webpack')

module.exports = {
  entry: `${SRC_DIR}/index.jsx`,
  output: {
    filename: 'bundle.js',
    path: DIST_DIR
  },
  plugins: [
    new webpack.DefinePlugin({'process.env': {NODE_ENV: JSON.stringify('production')} })
  ],
  module: {
      loaders: [
      {
        test: /\.jsx?/,
        include: SRC_DIR,
        loader: 'babel-loader',
        query: {
          plugins: ["transform-object-rest-spread", "transform-class-properties"],
          presets: ['react', 'es2015']
       }
      }
    ]
  }
};

Answer 1

如果您想在生产模式下构建应用，则应使用webpack production shortcut。像这样：

webpack -p

这将使webpack optimize options缩小您的JS。查看webpack标志on this SO answer的详细说明。

Answer 2

Webpack插件需要放在spark-default.conf的{{1}}键下。

Sample

试试这个：

plugins

Answer 3

如果您使用Webpack 4，则无需更改package.json。它在开发和生产模式中都保持不变。

唯一需要的是"scripts": { "dev": "webpack --mode development", "build": "webpack --mode production" }：

npm run dev

有了这个，创建一个开发包：

npm run build

生产包：

{{1}}

Answer 4

有同样的错误，所以要解决它我做了这个：

<强>的package.json

"scripts": {
  "build": "NODE_ENV=production webpack --progress --colors",
  "start": "NODE_ENV=development webpack-dev-server --progress --colors"
}

<强> webpack.config.js

const env = process.env.NODE_ENV

module.exports = {
  plugins: [
    new webpack.DefinePlugin({
      'process.env.NODE_ENV': JSON.stringify(env)
    })
  ]
}

它应该可以肯定。

Here我有一些配置可以尝试优化您的构建。

如何将React置于生产模式？

4 个答案: