vue history路由 nginx配置

Vue.js的`history`路由模式是一种在单页应用（SPA）中使用的路由处理方式，它允许用户通过浏览器的URL直接访问应用程序的不同部分，而不会刷新整个页面。为了实现Vue的`history`路由，你需要做以下几步：

1. 配置Vue Router：在Vue项目中，安装`vue-router`并启用`history`模式：

   npm install vue-router

然后，在配置文件（通常为`router/index.js`）中设置：

   import Vue from 'vue';
   import Router from 'vue-router';
   Vue.use(Router);

   const routes = ...; // 你的路由配置

   export default new Router({
     mode: 'history',
     routes,
   });

2. 启动服务器：在生产环境中，需要一个支持`history`模式的服务器，如Express或Nginx。对于Nginx，你需要配置`try_files`和`rewrite`规则，将所有请求转发到你的应用服务器上。

server {
    location / {
        try_files $uri $uri/ @router;
    }

    location @router {
        proxy_pass http://your-app-server-url;
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}

记得将`http://your-app-server-url`替换为你实际的Vue应用服务器地址。