Interface environment settings

• Different configurations are required for different stages of development and launch

• Different cross-domain methods, different configurations

• When packaging, inject environmental parameters uniformly, manage the environment uniformly, and output different version packages

  • Create a new env.js file in the scr directory to configure different environments and use different parameters

    let baseURL
    // 在node中有一个process.env.NODE_ENV进程，可以取到环境变量中的参数
    switch (process.env.NODE_ENV) {
            
            
      case 'development':
        baseURL = 'http://dev-xx-xxx.com/api'
        break
      case 'test':
        baseURL = 'http://test-xx-xxx.com/api'
        break
      case 'production':
        baseURL = 'http://xx-xxx.com/api'
        break
      default:
        baseURL = 'http://xx-xxx.com/api'
        break
    }
    
    export default {
            
            
      baseURL
    }
    

    • There is a process.env.NODE_ENV process in node, which can take the parameters in the environment variable
    • CORS cross-domain and jsonp cross-domain can use this configuration

  • Add test packaging, online packaging and local runtime environment required in the package.json file

    "scripts": {
            
            
        "serve": "vue-cli-service serve --mode=development",
        "test": "vue-cli-service build --mode=test",
        "build": "vue-cli-service build --mode=production",
        "lint": "vue-cli-service lint"
      },
    

    • --Mode= The following parameters cannot be written at will, and an error will be reported

  • Finally, you need to import the env.js file in main.js

    import env from './env'
    
    // 根据前端的跨域方式做调整
    axios.defaults.baseURL = '/api'
    // 根据环境变量获取不同的请求地址
    axios.defaults.baseURL = env.baseURL
    // 超时处理
    axios.defaults.timeout = 8000