创新实训博客（31）——Vue.js前端项目的生产环境部署

开启生产环境模式

开发环境下，Vue 会提供很多警告来帮你对付常见的错误与陷阱。而在生产环境下，这些警告语句却没有用，反而会增加应用的体积。此外，有些警告检查还有一些小的运行时开销，这在生产环境模式下是可以避免的。

不使用构建工具

如果用 Vue 完整独立版本，即直接用 <script> 元素引入 Vue 而不提前进行构建，请记得在生产环境下使用压缩后的版本 (vue.min.js)。

使用构建工具

当使用 webpack 或 Browserify 类似的构建工具时，Vue 源码会根据 process.env.NODE_ENV 决定是否启用生产环境模式，默认情况为开发环境模式。

在 webpack 与 Browserify 中都有方法来覆盖此变量，以启用 Vue 的生产环境模式，同时在构建过程中警告语句也会被压缩工具去除。

所有这些在 vue-cli 模板中都预先配置好了，但了解一下怎样配置会更好。

WebPack：

module.exports = {
  mode: 'production'
}

Browserify：

在运行打包命令时将 NODE_ENV 设置为 "production"。

这等于告诉 vueify 避免引入热重载和开发相关的代码。 对打包后的文件进行一次全局的 envify 转换。

这使得压缩工具能清除掉 Vue 源码中所有用环境变量条件包裹起来的警告语句。

Rollup：

const replace = require('@rollup/plugin-replace')
rollup({
  //