使用nginx給vue開發環境的位址自定義乙個網域名稱

2021-09-29 20:50:31 字數 651 閱讀 1767

使用vue-cli開發的時候,npm run dev生成的預設鏈結是http://localhost:8080,看上去很不爽,於是就嘗試使用nginx反向**給這個鏈結取個自定義網域名稱,還真成功了,話不多說直接上**:

1、修改host。檔案:/config/index.js

host:

'127.0.0.1'

, port:

8080,

2、禁用webpack的hostcheck。檔案:/build/webpack.dev.conf.js (禁用此項是為了不讓wepack報錯,不影響開發和生產)

devserver:

3、安裝並配置nginx檔案,開乙個server

server 

}

4、修改host,即在host下增加如下**:

127.0

.0.1 example.com

5、啟動nginx,啟動開發環境下的vue,我用的npm,就直接npm run dev

6、在瀏覽器裡輸入你自己定的網域名稱,我這裡寫的是example.com做為例子,可自定義。

這樣就能用自己定義的網域名稱訪問vue開發環境了。

nginx開發環境配置

nginx開發環境配置步驟 1.檢視nginx配置檔案位置 ps ef grep nginx c 是指用的 etc nginx nginx.conf 這個的配置檔案。2.檢視配置檔案 cat etc nginx nginx.conf,最後幾行中 nginx的虛擬網域名稱配置都放這個裡面了。載入是以....

Nginx 開發環境配置

2.啟動指令碼 set path path c webserver nginx 監聽埠 listen 9999 server name localhost 工作目錄 root d workspace server www nginx nginx 內部採用相對路徑配置執行,單純將 nginx 命令加入...

vue開發環境搭建

安裝完成後,附件裡選擇命令提示符 或者在開始的搜尋框裡輸入cmd回車調出命令面板 輸入 node v回車,出現相應版本證明安裝成功,node環境已經安裝完成,由於有些npm有些資源被遮蔽或者是國外資源的原因,經常會導致用npm安裝依賴包的時候失敗,所有我還需要npm的國內映象 cnpm。在命令列中輸...