vue 專案 部署指令碼 自動部署

用vuejs開發快兩年了，不得不說vue是個好框架，當時在前期部署的時候每次都很頭疼，因為次次都要很麻煩，不同的環境，測試機， 需要管理很多ip使用者名稱，所以想封裝乙個指令碼，只需要修改對應的配置檔案，就可以乙個命令去部署

廢話不多說，在這個指令碼執行前，需要配置部署機器的ssh key 到伺服器的使用者下,具體可以參考

雖然很想自己寫乙個詳細的，無奈手太懶）

看看webpack的配置config.js 中assetspublicpath配置項 為/

然後在vue專案根目錄下建立兩個檔案

prod_branch=生產分支名

prod_host=生產機器ip
prod_user=生產機器使用者
prod_path=專案路徑
test_branch=測試環境分支名
test_host=測試環境機器ip
test_user=測試環境機器使用者
test_path=測試環境專案路徑

#!/bin/sh

#獲取環境名
env=''
if [ x$1 != x ];then
env=$1
else
env='prod'
fi#獲取當前分支名
curr_branch=`git symbolic-ref --short -q head`
echo
'當前工作分支 => '
$'\n'
echo
'讀取配置檔案:'
deploy_branch=`sed '/^'
$_branch'=/!d;s/.*=//' deploy.conf`
deploy_host=`sed '/^'
$_host'=/!d;s/.*=//' deploy.conf`
deploy_user=`sed '/^'
$_user'=/!d;s/.*=//' deploy.conf`
deploy_path=`sed '/^'
$_path'=/!d;s/.*=//' deploy.conf`
echo
'分支 => '
$echo
'位址 => '
$echo
'使用者 => '
$echo
'路徑 => '
$echo
'\n'
echo
'儲存當前修改'
git stash 
echo
'\n'
echo
'切換到需發布的分支 => '
$git checkout $deploy_branch
echo
'\n'
echo
'編譯專案'
npm run build
echo
'\n'
echo
'刪除老版本'
ssh $@$
"rm -rf "
$echo
'上傳新版本'
scp -r ./dist $@$:$
echo
'\n'
echo
'切回工作分支 => '
$git checkout $curr_branch
echo
'\n'
echo
'釋放修改'
git stash pop
echo
'\n'
echo
'部署成功'

後期我會把它封裝成個npm包，直接用命令配置解決這些問題

vue專案部署

1 更改專案下config資料夾index.js檔案 標紅處兩個位置 build 2 打包檔案，npm run build 之後會生成乙個dist資料夾,即為打包好的檔案，將檔案放在磁碟中，配置nginx監聽80埠，並指定服務名稱server name，最終可用kangqiao.kangqiao.c...

vue專案部署

放到純英文目錄下 啟動nginx 雙擊nginx.exe或者cmd視窗切換到nginx檔案下 輸入命令 nginx.exe 或者 start nginx 如果失敗報錯0.0.0.0 80 failed 檢視博文 複製出乙份nginx.conf 重新命名為 x.conf 修改 此處dist直接放在ng...

vue專案部署Nginx

cd usr local 切換路徑 1.2 解壓安裝 tar zxvf nginx 1.6.2.tar.giz c usr local local這個目錄類似於windows的program目錄，所以一些軟體可以都安裝在這裡 1.yum install pcre 2.yum install pcre...