手動純靜態文件打包部署預覽連結(部署到GitHub)，來自於vue的cli官方文件，使用的是yarn

寫完專案後，需要部署和發布，這個使用vue@cli搭建的項目，只有前端的靜態文件，調用後端的接口，並且是部署到GitHub的話可以使用這個步驟。

注意的點：1，你的gitbash是安裝切割配置好了的

                 2，每個修改程式碼都需要從新push到生產環境中## 這是手動更新的步驟，也是可以自動更新，需要另外的設定

會有兩個環境，所以要建造兩個倉庫，一個是放程式碼的環境，一個是生產環境，程式碼環境的程式碼改變就需要bulid，會產生一個新的生產換行，然後push到存放生產環境的倉庫，

1，命令列

## ```  yarn build

 ```

2.

點鏈接，語言切換成中文


 

 用一個東西監聽產生的dist目錄

 ~~~

 用一個東西監聽產生的dist目錄

 ~~~

 yarn global add serve

 serve -s dist

 //這兩行是確保dist目錄打包好了

 ~~~

 安裝好後，網頁埠變成5000多，打包檔案會被壓縮，

 

 

3.在vue.config.js 中設定正確的publicPath。

~~~

module.exports = {

  publicPath: process.env.NODE_ENV === 'production'

#    ? '/my- project/' //生產環境的名稱

    : '/'           //

}

#~~~

4.在專案中建立deploy .sh檔

~~~

#!/usr/bin/env sh

## 當發生錯誤時中止腳本

set -e

# 建置

npm run build

# cd 到建置輸出的目錄下 

cd dist

# 部署到自訂網域域名

# echo 'www.example.com' > CNAME

git init

git add -A

git commit -m 'deploy'

# 部署到https://.github.io

# git push -f git@github.com:/.github.io. git master

# 部署到https://.github.io/

# git push -f git@github.com:/ .git master:gh-pages

#cd -

~~~

然後執行deploy.sh

~~~

//需要設定好環境gitbash，cmder

sh deploy.sh

//會執行檔案裡的指令

~~~###

以上是手動純靜態文件打包部署預覽連結(部署到GitHub)，來自於vue的cli官方文件，使用的是yarn的詳細內容。更多資訊請關注PHP中文網其他相關文章！