1. 程式人生 > >vue history 模式nginx配置及配置後重新整理 404 的解決辦法!

vue history 模式nginx配置及配置後重新整理 404 的解決辦法!

vue history模式下nginx配置
在usr/local/nginx/conf/vhost 下 域名.conf配置檔案修改或新增

server
    {
        ##在server下新增或在location裡面新增以下程式碼
        location / 
        {
            if (!-e $request_filename) {
                rewrite ^(.*)$ /index.html?s=$1 last;
                break;
            }
        }
        ## 如果訪問的不是根目錄用下面方式設定 qiancheng是我的子目錄
location /qiancheng{ if (!-e $request_filename) { rewrite ^/(.*) /qiancheng/index.html last; break; } } }

配置後重新整理頁面出現404的話前端改一下打包檔案把相對路徑改成絕對路徑就OK了!

    // 這是原來的程式碼
    <link href=./static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet>
    // 這是修改後的程式碼 
<link href=/static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet> // 如果訪問的是子目錄請加上子目錄 <link href=/子目錄/static/css/app.917e9845e61fd94284baf966597e6264.css rel=stylesheet>