yarn run build --report
file size gzipped
dist\js\chunk-vendors.df6b5bce.js 141.57 kib 49.51 kib
以上命令，build 後會生成report.html, 該檔案顯示引用的依賴包大小。
image.png
主要為vue庫大。
2.優化vue為 cdn方式引入
a) index.html 中引用vue
b) 配置webpack ：在vue.config.js中：
module.exports = {
configurewebpack: {//新增此段
externals: {
'vue': 'vue',
'vue-router': 'vuerouter'
對比大小
yarn run build --report
file size gzipped
dist\js\chunk-vendors.d6ca599e.js 51.15 kib 17.49 kib
chunk-vendors js小了 90k.
image.png
vue減少打包檔案大小
第一次使用vue2.0開發，之前都是用的angular1.x。在使用vue cli腳手架打包後 ui用的element ui 發現vendor檔案很大，將近1m左右。後來翻閱資料才明白，原來webpack把所有的庫都打包到了一起，導致檔案很大。我的解決辦法 1 把不常改變的庫放到index.html...
vue 專案打包
作為乙個前端之前並沒有打包過專案，因此想一下打包的效果，記錄一下我的打包過程 作為乙個開端 首先，專案打包前的目錄結構 然後，執行命令列 npm run build 因為是第一次打包，不熟悉打包的過程，與檔案的變更，首先看了一下檔案的結構，發現沒有compenent與views中檔案的生成目錄。是沒...
vue專案打包
首先開啟config index.js，將assetspublicpath值改為 注意是build的一對花括號裡 assetspublicpath 這個在你的build的一對花括號裡，用來解決js,css路徑問題 然後開啟 build utils.js 加上publicpath 如下 return ...