关于Vue.js项目build后部署到非站点根路径的问题

最近接触了下Vue.js框架，记录个build发布 production 版的部署位置问题：一般情况下，build出的dist直接放到Web服务器的根路径，如 http://www.xxx.com/ 访问就可以了，但如果想要放到子路径下，如 http://www.xxx.com/vue/ ，这时就会发现有资源加载报错了（通过vue-cli一般参数创建的项目， vue版本2.5.2）！

问题根源在于vue项目webpack打包时的资源路径默认使用的是：

  dev: {
    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {},
}

可以看到是’/’，所以只能认到根路径，如需部署到子路径，最简单的方式是将assetsPublicPath改为相对路径就可以了，如：

  build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '.',
}

这样就可以直接放到任意子路径下了。
PS: 可以只修改build环境相关配置，dev时使用webpack dev server保留’/’的方式也不会有问题！