nginx部署vue只能訪問預設頁面的問題

2021-10-04 14:11:47 字數 602 閱讀 3191

在通過nginx啟動vue以後我們在訪問頁面的時候只能訪問預設頁面和通過專案內跳轉其他頁面,如果重新整理就會404

通過預設頁面內部訪問:

直接重新整理:

可以看到nginx並不識別vue的其他頁面,這跟conf檔案的配置有關

location /
這是我們基礎的配置,按照字**讀就是只訪問了/dist檔案下的  index.html、index.htm、index.jsp頁面,而其他頁面在訪問的時候被nginx當作自身的服務訪問而找不到,我們修改一下配置檔案

location /
將預設的index注釋掉,換成了try_files,它會去掃瞄內部目錄然後再進行內部重定向。

nginx的try_files:

expires 是nginx控制快取的一種方式,7d=7天

nginx配置expires:

Nginx部署Vue專案

npm run build生成乙個dist資料夾。將dist目錄整個複製到nginx根目錄的html資料夾下。編輯conf目錄下的nginx.conf檔案 server 因為路由的路徑資源並不是乙個真實的路徑,所以無法找到具體的檔案 因此需要rewrite到index.html,然後交給路由再處理資...

nginx部署vue專案

nginx是乙個高效能的http和反向 伺服器。因此常用來做靜態資源伺服器和後端的反向 伺服器。本文主要記錄使用nginx去部署使用vue搭建的前端專案,專案基於vue官方的腳手架vue cli構建。打包vue專案 通過npm run build命令打包好的靜態資源將輸出到dist目錄中。1.win...

nginx部署vue專案

nginx是乙個高效能的http和反向 伺服器。因此常用來做靜態資源伺服器和後端的反向 伺服器。本文主要記錄使用nginx去部署使用vue搭建的前端專案,專案基於vue官方的腳手架vue cli構建。npm run build通過上面命令後打包好的靜態資源將輸出到dist目錄中。如圖所示 安裝ngi...