Skip to content

如何构建生产版本 ​

本节目标:理解“如何构建生产版本”的核心思路,并能把它用于实际开发或面试表达。 单文件构建 我们提供了可以在生产环境使用的单文件版 React 和 React DOM: <script src="https://unpkg.com/react@16/umd/react.production.min.js"></script><script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script> 注意只有以 .production.min.js 为结尾的 React 文件适用于生产。

Create React App如果你的项目是通过 Create React App 构建的,运行:npm run build这段命令将在你的项目下的 build/ 目录中生成对应的生产版本。注意只有在生产部署前才需要执行这个命令。正常开发使用 npm start 即可。

**webpack**
只有当你直接配置了 webpack 才需要参考以下内容。
在生产模式下,Webpack v4+ 将默认对代码进行压缩:
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
  mode: 'production',
  optimization: {
    minimizer: [new TerserPlugin({ /* additional options here */ })],
  },
};

你可以在 webpack 文档中了解更多内容。 请注意,你只需要在生产构建时用到它。你不需要在开发中使用 TerserPlugin 插件,因为这会隐藏有用的 React 警告信息并使得构建速度变慢。

本站总访问 — 次