最近在用vue寫了乙個專案用來webpack打包後，想要上傳到github，並通過github pages預覽，在這個過程中遇到了一些問題，因此寫個筆記，以便查閱
完成vue專案以後，在上傳到github之前，需要修改一些配置才能通過github pages預覽專案。
一、修改配置
解決檔案路徑問題：
開啟專案根目錄config資料夾下的index.js檔案，進行如下修改：
看清楚是 build（上邊還有個dev 是開發環境下的配置，不需要改動）下的 assetspublicpath ：將『/『改為『./』
背景路徑錯誤
在css中寫的background-img的路徑出錯需要找到build資料夾下的utils.js，修改一下位置
開啟根目錄build資料夾中的utils.js檔案，在下圖中標出的位置中新增publicpath: 『…/…/』，
專案打包後dist資料夾下的index.html引入檔案沒有引號，這裡的解決方法是：
找到build資料夾下的webpack.prod.conf.js檔案，在webpack.prod.conf.js找到new htmlwebpackplugin中的minify，把minify中的 removeattributequotes: true改為 removeattributequotes:false
二、上傳專案到github
執行npm run build命令，打包專案
如果只是想通過github pages預覽專案，不想上傳整個專案**，可以只將dist資料夾下的檔案上傳到github上，然後開啟github pages功能預覽。在dist資料夾下執行以下步驟
1.在github裡面新建乙個倉庫
2.將dist資料夾中的檔案上傳到這個倉庫中
git init
git add .
git commit -m '描述資訊'
關聯到遠端倉庫：git remote add origin ...
git push -u origin master
1.在github裡面新建乙個倉庫,
2.將整個專案上傳到github
git init
git add .
git commit -m '描述資訊'
關聯到遠端倉庫：git remote add origin ...
git push -u origin master
3.然後將遠端倉庫轉殖到本地
git clone ...
生成分支gh-pages並切換到此分支
進入到轉殖得到的資料夾中，執行如下命令
git checkout --orphan gh-pages
5.將轉殖得到的檔案裡面除了.git檔案以外的檔案全部刪掉，再將專案根目錄下打包後生成的dist資料夾裡面的內容複製到轉殖檔案中。
依次執行以下命令：
git add .
git commit -m 「描述資訊」
git remote add origin ...
.（這一步根據自己建立的倉庫名來寫）
git push -u origin gh-pages （pus**件到倉庫中,注意後面是分支的名字,不是master
webpack打包快取 webpack打包效能分析
webpack提供的uglifyjs外掛程式由於採用單執行緒壓縮，速度很慢 webpack parallel uglify plugin外掛程式可以並行執行uglifyjs外掛程式，這可以有效減少構建時間，當然，該外掛程式應用於生產環境而非開發環境，配置如下 var paralleluglifypl...
webpack打包快取 webpack打包優化探索
雖然webpack的已經公升級到了webpack4，而我們目前還在使用 webpack3，但其中的優化點都大同小異，公升級後同樣適用。效能優化初步原則 這三條原則永遠是一切優化的前提 優化配置 公升級webpack 3，優化js的編譯能力 scope hoisting 1performance 減小...
vue cli專案webpack打包結構
每次我們拿到vue的專案，第一步都是先npm install載入其依賴，其然後是npm run dev執行這個專案，我很好奇其內部的怎樣執行的，就把這大概的流程走一走，以供參考。我們先來看一下package.json的目錄 每次當我們npm run dev的時候，其首先執行的是build webpa...