vue-cli2x history模式 部署在服务器端的nginx配置 (非根目录)

参考：https://segmentfault.com/a/1190000017009422?utm_source=tag-newest
vue history需要nginx或者其他方式配置一下才可正确访问，否则路由跳转之后刷新一下便会404 具体原因vue-router官网有说明，在此不多说

该项目是用的vue-cli2x 最近遇到了新问题，我整个项目被拆分为多个vue站点，这个时候，域名是相同的只是第一级路径是不同的依次来区分重定向到哪个站点，这就需要部署服务的时候做区分，不能再/根目录做nginx配置，应该是/a到a站点，/b到b站点

解决方案如下(以a站点nignx部署配置和vue配置举例)

本地安装nginx进行测试，配置如下

server {
        listen       80;
        server_name  localhost;

        location /a{
            root E:/xxx/xxx/dist;
            index  index.html index.htm;  
            try_files $uri $uri/ /a/index.html;
        }
    }

vue router 配置

// 路由配置
const RouterConfig = {
  base: "/a/",
  mode: 'history',
  routes: routers
};

该项目是用的vue-cli2 所以只需要修改config 里面的index.js的build部分

webpack 配置修改

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/a/index.html'),
    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'a/static',
    assetsPublicPath: '/',
  }

最终项目地址为 http://.xxx.com/a/
同理b站点也是一样的配置