生产环境部署— Vue.js | vue build部署
您在浏览的是v2.x及更早版本的文档。v3.x的文档在这里[1]。以下大多数内容在你使用VueCLI[2]时都是默认开启的。该章节仅跟你自定义的构建设置有关。开启生产环境模式开发环境下,Vue会提供很多警告来帮你对付常见的错误与陷阱。而在生产环境下,这些警告语句却没有用,反而会增加应用的体积。此外,有些警告检查还有一些小的运行时开销,这在生产环境模式下是可以避免的。不使用构建工具如果用Vue完整独立版本,即直接用
您在浏览的是 v2.x 及更早版本的文档。v3.x 的文档在这里[1]。
以下大多数内容在你使用 Vue CLI[2] 时都是默认开启的。该章节仅跟你自定义的构建设置有关。
开启生产环境模式开发环境下,Vue 会提供很多警告来帮你对付常见的错误与陷阱。而在生产环境下,这些警告语句却没有用,反而会增加应用的体积。此外,有些警告检查还有一些小的运行时开销,这在生产环境模式下是可以避免的。
不使用构建工具如果用 Vue 完整独立版本,即直接用 <script> 元素引入 Vue 而不提前进行构建,请记得在生产环境下使用压缩后的版本 (vue.min.js)。两种版本都可以在安装指导[3]中找到。
使用构建工具当使用 webpack 或 Browserify 类似的构建工具时,Vue 源码会根据 process.env.NODE_ENV 决定是否启用生产环境模式,默认情况为开发环境模式。在 webpack 与 Browserify 中都有方法来覆盖此变量,以启用 Vue 的生产环境模式,同时在构建过程中警告语句也会被压缩工具去除。所有这些在 vue-cli 模板中都预先配置好了,但了解一下怎样配置会更好。
webpack在 webpack 4+ 中,你可以使用 mode 选项:
module.exports = { mode: production }但是在 webpack 3 及其更低版本中,你需要使用 DefinePlugin[4]:
var webpack = require(webpack) module.exports = { // ... plugins: [ // ... new webpack.DefinePlugin({ process.env.NODE_ENV: JSON.stringify(production) }) ] } Browserify在运行打包命令时将 NODE_ENV 设...