多個vue專案生產環境下NGINX配置檔案

2021-09-26 20:52:13 字數 1393 閱讀 9029

1. 多個專案

2. 同一埠

3. 多個專案使同一ip

通過nginx**的有三種路徑

1. api型別,訪問後台介面服務,nginx負責反向**

2. 靜態檔案型別,訪問css,js等檔案

3. vue路由型別,全部指向index.html

webpack打包的靜態檔案訪問路徑必須為:專案名稱/static
# 多專案下靜態檔案配置

location ~ (.*)/static/

vue打包後的路由配置必須為:專案名稱

#  多版本配置情況的配置:專案名稱/v + 版本號

location ~ /(\w+)/v(\d+)

# 通用配置:專案名稱

location ~ /(\w+)

經過webpack打包後的檔案,在dist資料夾下

將index.html和static資料夾放到nginx的根目錄(預設為/usr/share/nginx)下的bms資料夾

確定靜態檔案的訪問路徑,bms/static + 具體檔案路徑

確定介面訪問路徑,api + 具體介面路徑

nginx配置

user nginx;

worker_processes auto;

# 錯誤日誌

error_log /var/log/nginx/error.log;

# pid

pid /run/nginx.pid;

# 預設包含的配置

# 多專案下靜態檔案配置

location ~ (.*)/static/

# 多專案下資料夾配置

location ~ /(\w+)/v(\d+)

# 多專案下index.html

location ~ /(\w+) }}

vue專案多個環境配置

env production outputdir prod import axios from axios create an axios instance const service axios.create timeout 5000,按照這個道理我們可以配置其他不同的環境。3.但是問題來啦,我們...

vue專案打包部署生產環境

打包部署生產環境之前需要修改配置檔案 修改一 build utils.js 修改publicpath 這樣寫是處理打包後找不到靜態檔案的問題 修改二 config index.js 修改assetspublicpath 修改目的是為了解決js找不到的問題 3.執行命令 npm run build 打...

vue環境下新建專案

1.之前電腦上安裝了node和npm,檢視下版本資訊。2.現在安裝vue cli腳手架,可以全域性安裝 之前自己電腦沒有安裝過webpack,所以在這邊安裝一下。3.建立乙個基於webpack的專案 之前有寫安裝node,webpack的操作過程 有部分就是按回車自動生成的答案,有的是手打的。4.安...