vue process.env.VUE
1、根目录底下新建.env.dev和env.prod,内容如下:
VUE_APP_BASE_API = 'http://192.168.1.xx:xxx'
2、vue.config相关内容:
devServer: { hot: true, //热加载 host: '0.0.0.0', port: 8080, //端口 // https: false, //false关闭https,true为开启 // open: true, //自动打开浏览器 proxy: { // 在此处为需要解决跨域的 API 配置代理 '/api': { target: process.env.VUE_APP_BASE_API, changeOrigin: true, rewrite: path => path.replace(/^\/api/, '') // 去掉 /api 前缀 } } }
3、package.json内容修改如下
"scripts": { "serve": "vue-cli-service serve --mode dev", "build": "vue-cli-service build --mode prod", "lint": "vue-cli-service lint" },
5、axios封装
import axios from 'axios' const service = axios.create({ baseURL: process.env.VUE_APP_BASE_API, timeout: 5000 }) // console.log(process.env.VUE_APP_BASE_API) // 请求拦截器 service.interceptors.request.use( config => { // 添加请求头等前置处理 config.headers['Authorization'] = 'Bearer' + ' ' + localStorage.getItem('token') return config }, error => { // 请求错误处理 console.log('Request Error:', error) return Promise.reject(error) } ) // 响应拦截器 service.interceptors.response.use( response => { // 响应后处理 if (response.status === 200 && response.data.code === 200) { return Promise.resolve(response.data.data) } else { return Promise.reject(response.data) } }, error => { console.log('Response Error:', error) return Promise.reject(error) } ) export default service
(图片来源网络,侵删)
文章版权声明:除非注明,否则均为主机测评原创文章,转载或复制请以超链接形式并注明出处。