问题描述：
前端使用vue-cli开发单页路由项目，放到nginx上访问的时候，刷新会出现404现象
服务端一开始的配置如下：
server { ???????listen ??????80; ???????server_name ?localhost; ???????#charset koi8-r; ???????#access_log ?logs/host.access.log ?main; ???????location / { ???????????root ??html; ???????????index ?index.html index.htm; ???????} ???????#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; ???????} ???????# proxy the PHP scripts to Apache listening on 127.0.0.1:80 ???????# ???????#location ~ \.php$ { ???????# ???proxy_pass ??http://127.0.0.1; ???????#} ???????# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 ???????# ???????#location ~ \.php$ { ???????# ???root ??????????html; ???????# ???fastcgi_pass ??127.0.0.1:9000; ???????# ???fastcgi_index ?index.php; ???????# ???fastcgi_param ?SCRIPT_FILENAME ?/scripts$fastcgi_script_name; ???????# ???include ???????fastcgi_params; ???????#} ???????# deny access to .htaccess files, if Apache‘s document root ???????# concurs with nginx‘s one ???????# ???????#location ~ /\.ht { ???????# ???deny ?all; ???????#} ???}解决方法：
在nginx配置里添加vue-route的跳转设置（这里首页是index.html，如果是index.php就在下面对应位置替换），正确配置如下：
server { ???????listen ??????80; ???????server_name ?localhost; ???????#charset koi8-r; ???????#access_log ?logs/host.access.log ?main; ???root C:\Users\vicky\Documents\primary\i-link-request\dist; ???index ?index.html index.htm; ???????????????location / { ????????????try_files $uri $uri/ @router; ????????????index index.html; ????????} ???????location @router { ???????????rewrite ^.*$ /index.html last; ???????} ???????#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; ???????} ???????# proxy the PHP scripts to Apache listening on 127.0.0.1:80 ???????# ???????#location ~ \.php$ { ???????# ???proxy_pass ??http://127.0.0.1; ???????#} ???????# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000 ???????# ???????#location ~ \.php$ { ???????# ???root ??????????html; ???????# ???fastcgi_pass ??127.0.0.1:9000; ???????# ???fastcgi_index ?index.php; ???????# ???fastcgi_param ?SCRIPT_FILENAME ?/scripts$fastcgi_script_name; ???????# ???include ???????fastcgi_params; ???????#} ???????# deny access to .htaccess files, if Apache‘s document root ???????# concurs with nginx‘s one ???????# ???????#location ~ /\.ht { ???????# ???deny ?all; ???????#} ???}修改的主要配置为：
location / { ?????try_files $uri $uri/ @router; ?????index index.html;}location @router { ?????rewrite ^.*$ /index.html last;}重启nginx 之后就可以正常访问了
vue-route+webpack部署单页路由项目，访问刷新出现404问题
原文地址：http://www.cnblogs.com/rongjuan/p/7513271.html