最近需要開發網站，但好像沒找到比較好的部署前端流程說明，簡單記錄了一下自己的部署流程，僅供參考，
本服務器系統為Ubuntu，不清楚其它系統也是否適用本流程，
1.安裝Nginx
Nginx (engine x) 是一個高性能的HTTP和反向代理web服務器，其占用記憶體少、并發能力強、能支持高達 5w 個并發連接數，
更多可以了解 萬字總結，體系化帶你全面認識 Nginx ！
1.安裝
sudo apt install nginx
檢查是否安裝成功
nginx -v
2.前端代碼打包
可以了解下 前端 - 什么是"打包"?
1.在專案目錄下運行npm run build，進行打包
npm run build
打包完成后會在目錄下生成一個build檔案夾（或者dist），build生成的這些東西便是要放在服務器中的檔案了，
當然如果目前沒有專案目錄單純體驗部署前端的話可以簡單寫個html檔案，不用打包，后面就上傳個html就行，
2.將生成的包上傳至服務器中，這邊我用的工具是winscp，上傳路徑自定義，我一般都上傳至/var/www/目錄下，
3.修改Nginx組態檔
組態檔目錄下/etc/nginx/的 sites-available 檔案夾主要存放站點組態檔，其中default檔案為虛擬站點的配置模板，自己的虛擬站點可以以此為模板進行配置，后續當有多個網站或者部署后端使也是在該檔案下進行配置，這時就需要用到域名來決議各個網站的請求了，
1.進入編輯/etc/nginx/sites-enabled/default
vim /etc/nginx/sites-enabled/default
2.修改組態檔
關于檔案中各引數的了解可以參考 寫給Web開發人員看的Nginx介紹 ，建議先了解里面各個引數，估計了解完也知道接下來該怎么做了，
目前要修改的地方有root部分，root定義的就是代碼包存放的路徑，即之前上傳至服務器的代碼包路徑，
如果是專案包的話還需要修改location部分，新增try_files $uri $uri/ /index.html;，這將能使各個頁面能夠被正常打開，
server {
listen 80 default_server; # 默認監聽外部請求的80埠
listen [::]:80 default_server;
#root /var/www/html;
root /var/www/racing_web; #變動這里~
# Add index.php to the list if you are using PHP
# index index.html index.htm index.nginx-debian.html;
index index.html;
server_name _; #匹配url地址,_代表服務器的ip，如果有域名配置好了即可填域名
location / {
try_files $uri $uri/ /index.html; #變動這里~
}
}
3.修改完成后，重新啟動Nginx
可以參考 Nginx常用命令
systemctl reload nginx
之后訪問服務器IP地址便能得到你的頁面了，
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/321156.html
標籤：其他