javascript - React 开发工具提示生产中的未缩小版本

标签 javascript reactjs webpack

我有一个正在制作中的网站,其中 Chrome 开发工具说:

This page is using an unminified build of React. 🚧

在我的构建过程中,webpack 配置正在运行 production 标志 on。我的设置是:

plugins: [
  new webpack.DefinePlugin({
    'process.env': {
      NODE_ENV: JSON.stringify('production')
    }
  }),
  new webpack.optimize.OccurrenceOrderPlugin(),
  new webpack.optimize.UglifyJsPlugin({
    mangle: false,
    beautify: false,
    sourcemap: false,
    comments: false,
    minimize: true,
    compress: {
      warnings: false,
      comparisons: false
    },
    output: {
      comments: false,
      ascii_only: true
    }
  })
]

我正在使用 import 在我的 .js.jsx 文件中加载 React,加载带有指向 .min.js 文件的脚本标签的 HTML。与开发版本相比,代码的大小仍然有所减少。

我做错了什么?该警告的原因是什么?

我的版本:

"react": "^15.4.2",
"react-dom": "^15.4.2",
"webpack": "^2.7.0"

最佳答案

经过反复试验设置mangle: true,关闭警告。

我没有在 React 文档中找到关于此的信息,但它确实有效。

React does suggest在其默认配置中运行 UglifyJsPlugin,默认情况下 mangle 设置为 true:

new webpack.DefinePlugin({
  'process.env': {
    NODE_ENV: JSON.stringify('production')
  }
}),
new webpack.optimize.UglifyJsPlugin()

关于javascript - React 开发工具提示生产中的未缩小版本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45905630/

相关文章:

javascript - 如何使用 Protractor 在富文本编辑器上使用 SendKeys 函数?

javascript - 使用 Javascript 或 JQuery 删除特定字符后的文本

javascript - 如何在 React 组件中导入 CSS 文件

reactjs - 当我单击新链接时,React-Router 不会重新渲染

javascript - 从 Javascript 模块中的父作用域继承变量

angular - 强制编译的 CSS 与 Angular 和 Webpack 内联

javascript - 如何将 Django 服务器变量传递到 React jsx 中?

javascript - Angular - 在本地文本文件中保存 blob?

javascript - React js 中常见的 header 问题

javascript - 模块构建失败: SyntaxError: Unexpected token