本文來源於阿里雲-雲棲社區，原文點擊這裏。
開發時，Vue會提供很多警告來幫你解決常見的錯誤與陷阱。生產時，這些警告語句卻沒有用，反而會增加你的載荷量。再次，有些警告檢查有小的運行時開銷，生產環境模式下是可以避免的。
不用打包工具
如果用Webpack或Browserify類似的打包工具時，生產狀態會在Vue源碼中由process.env.NODE_ENV決定，默認在開發狀態。Webpack與Browserify兩個打包工具都提供方法來覆蓋此變量並使用生產狀態，警告語句也會被精簡掉。每一個vue-cli模板有預先配置好的打包工具，但瞭解怎樣配置會更好
webpack
使用Webpack的DefinePlugin來指定生產環境，以便在壓縮時可以讓UglifyJS自動刪除代碼塊內的警告語句。例如配置：
var webpack = require('webpack')
module.exports = {
// ...
plugins: [
// ...
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: '"production"'
}
}),
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false
}
})
]
}
Browserify
運行打包命令，設置NODE_ENV爲"production"。等於告訴vueify避免引入熱重載和開發相關代碼。使用一個全局envify轉換bundle文件。這可以精簡掉包含在Vue源碼中所有環境變量條件相關代碼塊內的警告語句。例如：
NODE_ENV=production browserify -g envify -e main.js | uglifyjs -c -m > build.js
Rollup
const replace = require('rollup-plugin-replace')
rollup({
// ...
plugins: [
replace({
'process.env.NODE_ENV': JSON.stringify( 'production' )
})
]
}).then(...)
預編譯模板
當需要處理DOM內或JavaScript內的模板時，“從模板到渲染函數”的編譯就會在線上發生。通常情況下這種處理是足夠快的，但是如果你的應用對性能很敏感最好還是迴避。預編譯模板最簡單的方式就是使用單文件組件--相關的構建設置會自動把預編譯處理好，所以構建好的代碼已經包含了編譯出來的渲染函數而不是原始的模板字符串。如果使用Webpack並且喜歡分離JavaScript和模板文件，可以使用vue-template-loader，它也可以在構建過程中把模板文件轉換成爲JavaScript渲染函數。