我的項目是webpack構建的，因為我做一切開發都想要希望要從一個標準的構建去編碼

所以，我的項目在node下運行，開發，調試是沒有一點問題的，npm run build也是完全OK的，vue路由是history模式

把build出來的dist文件夾部署到生產環境，使用nginx的時候，問題就來了

我的問題描述：

如果從首頁打開，點擊任何頁面都能夠正常訪問，而當你處在某個頁面（非首頁）的時候，刷新就出現了404錯誤。這就很尷尬了。

通過不斷調試思考，最終我查到了兩個解決方法，以供需要的兄弟參考，適合使用寶塔管理的兄弟

以下兩種解決方法的前提是，要把dist里面的文件全部拷貝到nginx服務器的根目錄下，否則配置起來會麻煩很多，就是每個路由節點都要添加下面的解決代碼。

比如你dist文件放在這個網站目錄下/aaa/bbb/dist，

這時候，就要在server /aaa {}配置一遍，server /aaa/bbb {}配置一遍

如果非要在根目錄的多級目錄下配置站點，可以參考這個博客：https://www.cnblogs.com/haonanZhang/p/9791983.html

第一個解決方法：如下圖，直接在nginx配置文件里加上404處理

這樣就解決了報404的時候，原理是nginx在catch到404錯誤后路由才重新解析url，但是它有個可以忽略的小問題就是，404的錯誤在瀏覽器調試界面的網絡請求列表里還能看到

第二個解決方法：如下圖? 配置一個url重寫

它可以解決第一種方式中出現的小問題，原理是nginx在catch到404錯誤前就重寫了url

總結

以上是生活随笔為你收集整理的宝塔nginx运行vue项目刷新404问题解决的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。