VUE專案部署公網ip和埠以及使用網域名稱訪問配置

2022-05-08 21:33:14 字數 1193 閱讀 4873

前提是已經配置好了相應的外網和內網埠的對映

一.公網

ip和埠配置

在vue專案啟動之前對專案下:專案名

/config/index.js

檔案進行修改

原來的內容為:(位置在

index.js

的第16,17

行作用)

host: '

localhost

', //can be overwritten by process.env.host

port: 8080, // can be overwritten by process.env.port, if port is

in use, a free one will be determined

修改為0.0.0.0 和8070埠:

二.使用網域名稱

+埠訪問配置

沒有配置的情況下通過網域名稱加埠訪問出現:

在如下截圖的位置加這個配置:

disablehostcheck: true,// 解決網域名稱訪問本地執行位址時出現invalid host header的問題

在此用:npm run dev  執行

此時用網域名稱加埠訪問正常

此種部署有很大的缺點,不適合生成環境中,只能用於專案**測試 

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...