vue-cli2 代理处理跨域和打包

261 阅读1分钟

在vue.config.js下加入

module.exports = {
    devServer:{
        proxy: {
            //在main.js文件设置axios的默认路径为'/apiRequest'
            '/apiRequest': {
                //需要跨域的接口
                target: 'https://www.baidu.com:442', 
                //允许跨域
                changeOrigin: true,
                //重写
                pathRewrite:{
                    '^/apiRequest':''
                }
            }
        }
    }
}

服务器使用的是宝塔站点的nginx配置

#history路由配置
location / {
    try_files $uri $uri/ /index.html;
}
#/apiRequest/为上面替换的路径
location /apiRequest/ {
    #需要跨域的域名 这里后面记得加上一个 '/'
    proxy_pass https://www.baidu.com:442/;
}

打包配置css、js文件存放路径

module.exports = {
    publicPath:"./",    //同一配置寻找路径
    outputDir:"build",  //打包生成的文件名
    assetsDir:'public', //静态文件存放的文件名
}

运行npm run build部署即可