如何配置环境文件


我们在开发项目和发布项目后,都需要使用到不同的环境,我们需要让vue-cli在打包时知道我们需要用到的环境,因此我们需要在项目根目录创建不同的环境文件,让vue-cli知道npm run serve与npm run build时该如何打包。

使用.env.development配置开发环境
# just a flag
ENV = 'development'

# base api
VUE_APP_BASE_API = '/api'
使用.env.development配置开发环境
# just a flag
ENV = 'production'

# base api
VUE_APP_BASE_API = '/prod-api'
在封装请求时,我们可以根据不同的环境变量获取不同的baseUrl
import axios from 'axios'

const service = axios.create({
  baseURL: process.env.VUE_APP_BASE_API,
  timeout: 5000
})

// 请求拦截器
service.interceptors.request.use(
  config => {
    // 添加 icode
    config.headers.icode = '5FD82D1BDB03DBD2'
    // 必须返回 config
    return config
  }
)

export default service
vue