nginx静态文件(css,js等)反向代理

https://www.qzroc.com/index.php/archives/78/
场景如下：

微信或者第三方登录回调地址，有#号时，接收不到code参数，或者处理起来非常复杂
微信H5支付的回调地址，不允许有#
App分享，处理特殊字符时，可能会对#进行编译
开发App嵌入式页面时，与框架字段兼容性取值异常

解决步骤：

在vue根目录下创建vue.config.js 文件，内容如下

// product为工程名
module.exports = {
    publicPath: '/product/',
    outputDir: 'product'
}

修改router.js 文件

// product为工程名
const router = new VueRouter({
  mode: 'history',
  base: '/product/',
  routes
})

联合后端同事，修改Nginx配置

// product为工程名
location /product {
    index  index.html index.htm;
    try_files $uri $uri/ /product /;
}

转载请注明：有爱前端 » 处理 vue history模式打包后页面为空白页的问题