Stellen Sie dem Front-End des Vue-Projekts ein Präfix voran (einschließlich Seiten und statischer Ressourcen).

Spezifische Schritte

Konfiguration in Vue

(1) Router-Modus ändern und Präfix hinzufügen

Speicherort: index.js im Router-Ordner

const router = new Router({
    
    
  base: '/nhtjfx/', // 路由前缀(该地方配置后,会发现你的启动地址也会加上这个前缀)
  mode: 'history', // 采用history模式URL的路径才跟配置的对应上,不然URL是先加/#再追加配置的地
  routes:[...]
  });

(2) Implementieren Sie das Präfix statischer Dateien.
Speicherort: vue.config.js

Die src- oder href-Referenzposition statischer Ressourcen wie CSS und JS wird mit diesem Präfix hinzugefügt, was sich
beispielsweise im Inhalt der gepackten Datei index.html widerspiegelt

 未加之前:<link href="./static/js/chunk-c8ec8b4a.e230ecc5.js" rel="prefetch">
  加之后:<link href="/nhtjfx/static/js/chunk-c8ec8b4a.e230ecc5.js" rel="prefetch">
module.exports = {
    
    
  publicPath: '/nhtjfx/',
}

(3) Nignx-Konfiguration

server {
    
    
        listen       8088;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;
	
	location /nhtjfx/ {
    
    
	    alias /usr/local/linewell/web/nhjcfx/front/nhtjfx/;
	    index index.html;
	    try_files $uri $uri/ /nhtjfx/index.html;
	}

        #location / {
    
    
           # root  /usr/local/linewell/web/nhjcfx/front/nhtjfx;#vue前端项目打包后放在这里   
      #      root  /usr/local/linewell/web/nhjcfx/front/build;
      #      index  index.html index.htm;#这个index.html  是上面dist目录下的index.html
      #	    try_files $uri $uri/ /index.html; # 解决刷新出现404 
     #   }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
    
    
            root   html;
        }
    }

Guess you like

Origin blog.csdn.net/qq_20236937/article/details/132041886