ReactJS 中生产和开发构建之间的区别 [英] Difference between production and development build in ReactJS

问题描述

最近我开始学习 react，我看到了一个教程，他们使用 Webpack 来创建生产和开发版本.但是没有解释这两种构建之间的区别以及您必须在何时使用哪一种.我搜索了互联网，但没有找到任何对我有帮助的东西.有没有人有我错过/没读过的教程或解释?

Recently I started learning react and I saw a tutorial where they used Webpack to create the production and development builds. But there was no explanation on what the difference between those two builds is and which one you have to use when. I searched the internet but didn't find anything that helped me. Does anyone have a tutorial or an explanation that I missed/didn't read?

推荐答案

使用开发版本 - 顾名思义 - 出于开发原因.在这些构建中，您拥有 Source Maps、调试和热重载能力.

The development build is used - as the name suggests - for development reasons. You have Source Maps, debugging and often times hot reloading ability in those builds.

另一方面，生产版本在生产模式下运行，这意味着这是在您的客户端机器上运行的代码.生产构建运行 uglify 并将您的源文件构建为一个或多个最小化文件.它还提取 CSS 和图像，当然还有您使用 Webpack 加载的任何其他来源.也不包括热重载.根据您的 webpack devtool 设置.

The production build, on the other hand, runs in production mode which means this is the code running on your client's machine. The production build runs uglify and builds your source files into one or multiple minimized files. It also extracts CSS and images and of course any other sources you're loading with Webpack. There's also no hot reloading included. Source Maps might be included as separate files depending on your webpack devtool settings.

生产与开发的具体区别取决于您的偏好和要求，这意味着它在很大程度上取决于您在 Webpack 配置中编写的内容.

What specifically separates production from development is dependent on your preferences and requirements, which means it pretty much depends on what you write in your Webpack configuration.

webpack-production 文档 非常简单明了.另外，文章Webpack 3 + React — Production build tips 很好地描述了使用 Webpack 为 React 创建生产构建的过程.

The webpack-production documentation is very straight-forward. Also, the article Webpack 3 + React — Production build tips describes the process of creating production builds for React with Webpack pretty good.

这篇关于ReactJS 中生产和开发构建之间的区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！