vue中生产环境使用.env.development配置axios全局访问路由
时间: 2024-04-02 19:24:38 浏览: 111
vue实现配置全局访问路径头(axios)
在Vue中,可以通过在main.js中配置axios来实现全局访问路由。首先,在main.js中导入axios和VueRouter:
```javascript
import axios from 'axios'
import VueRouter from 'vue-router'
```
然后,在Vue实例中配置axios和VueRouter:
```javascript
const router = new VueRouter({
mode: 'history',
routes
})
Vue.prototype.$axios = axios
Vue.prototype.$router = router
```
最后,在需要使用axios和router的组件中,可以通过`this.$axios`和`this.$router`来访问axios和router:
```javascript
this.$axios.get('/api/data').then(response => {
console.log(response.data)
}).catch(error => {
console.log(error)
})
this.$router.push('/about')
```
在生产环境中,可以通过在`.env.production`文件中配置变量来指定axios的请求路径:
```
VUE_APP_API_URL=http://example.com/api
```
然后,在axios的配置中使用该变量:
```javascript
axios.defaults.baseURL = process.env.VUE_APP_API_URL
```
阅读全文