vue-cli打包上線全步驟分析

這次帶給大家vue-cli打包上線全步驟分析，vue-cli打包上線的注意事項有哪些，下面就是實戰案例，一起來看一下。

以vue創建的官方例子為例子，我們在開發環境的時候會npm run dev ，生成

而想要打包成一份很簡單，只需要 npm run build 這個指令

這兩個指令的設定檔在config的index.js 一種是build 一種是dev ，而我們想要在本地查看打包後的成果，需要在assetsPublicPath 改變它的路徑， 具體為什麼，可以看index.html引入的文件路徑

##之後只需要放在伺服器上運行就好了。

*

常用技巧

1.如果在config -> index.js 中的build 程式碼中的productionSourceMap的值設為false ，打包後檔案體積可以減少百分之八十

2.如果設定build資料夾下的webpack.prod.conf.js中HtmlWebpackPlugin外掛程式設定參數加入

hash: true，即會使打包產生的index.html中的js和css路徑帶有？隨機字串，也就是版本控制

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

推薦閱讀：

mpvue小程式markdown適配怎麼實作

vue2.0實作輸入方塊即時擷取更新步驟詳解

以上是vue-cli打包上線全步驟分析的詳細內容。更多資訊請關注PHP中文網其他相關文章！