1. 程式人生 > 前端設計 >慚愧!三四年的前端第一次部署dist

慚愧!三四年的前端第一次部署dist

背景介紹昂

剛到了新公司,沒有運營,領導要看我做的頁面怎麼辦,自能自己去琢磨了。
複製程式碼
現有條件
1. 公司配的一臺桌面雲系統
2. 告訴我伺服器地址 10.*.*.217 (公司內網)
3. 讓我找後端小哥哥開賬號
複製程式碼
還說啥,開幹呀...
一個小插曲,我登伺服器登了半天,回頭一看,賬戶名稱tmd填錯了,我一度懷疑這個是不是華為雲桌面的坑。。。事實證明,不是,就是我是個大傻子~~~
複製程式碼

小白部署步驟

1. 登入伺服器(linux系統)
    ssh **@*.*.*.* (ssh 賬戶@伺服器地址)
2. 檢查下是否安裝了node
   node -v
   沒有的話,就去裝node,(參考地址:https://www.cnblogs.com/sirdong/p/11447739.html)
複製程式碼

3. 檢查有沒有安裝nginx, 部署前端程式碼,反向代理必備 (參考:www.pianshen.com/article/306…

4. 回到本地bash npm run build 將dist資料夾上傳到伺服器上去 命令: $ scp -r ./dist @...://**(賬戶@伺服器地址:/伺服器上存放前端該專案的地址) 5. 一切準備就緒,開始修改配置 (vim || sudo vim) /usr/local/nginx/conf/nginx.conf 1)埠號不要和別的前端或後端的重了 2)伺服器地址,由localhost改成ip 3)root 伺服器上的前端頁面路徑 4)api 轉發

6. 重啟nginx nginx -s reload 7. 瀏覽器訪問這裡的${server_name}:${listen}
就可以啦

遇到的坑

  1. 登陸伺服器 報錯:Permission denied 自己賬號寫錯了
  2. nginx 配置介面轉發時,反斜槓使用錯誤 (參考:www.cnblogs.com/hualingyun/…

3. 前端的介面預設都加/api/字首,這樣反向代理可以去轉發這個/api/ 4.linux 系統,許可權問題,讓他們給你開伺服器賬號的,給你sudo許可權