webpack 总结
1.前后台分离项目难免会用跨域问题,可以在webpack的devServer中配置
devServer:{
proxy:{
"/api":{
target:"https://****.com" //数据接口的地址
changeOrigin:true, // 允许跨域
secure:false, // 允许运行在https上
pathRewrite: { //如果你不想总是传递 /api,可以重写路径
'^/api': ''
}
}
}
}
2.配置开发环境和生产环境的接口地址
//在vue-cli中分别找到config/dev.env.js 和prod.env.js 文件
//dev.env.js 配置如下
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
API_ROOT:'"//192.168.100.222:8080/api"'
})
//prod.env.js 配置如下
module.exports = {
NODE_ENV: '"production"',
API_ROOT:'"https://***.com/"'//线上接口地址
}
3.axios配置
再配置好下面代码,就可以直接在组件中使用axios拉取数据了