vue中环境变量以及基本使用

环境变量

• .env #在所有环境中被载入
  
• .env.development #开发环境下
  
• .env.production #生成环境下
  
  位于项目根目录;设置后,任何地方可以使用;

• 在配置文件中定义的变量格式:
  
  VUE_APP_XXX=
• 在组件里面取:
  
  process.env.变量名
• 重启服务,设置才能生效

通过环境变量,解决域名问题,统一配置,方便以后切换

vue.config.js

module.exports = {
	//配置, 这些配置都会自动加载到项目中		
	devServer: {
	// 项目运行时候的端口号
		port: 8000,
		//处理处理跨域  http://139.196.186.154:8080/index/index/index
		//当请求url中包含/index的时候,把把我们请求头http://localhost:8000改成http://139.196.186.154:8080,就不存在跨域了
		//请求的时候就会在/index这个地址前面加上http://139.196.186.154:8080,所以,前面地址不需要写这个http://139.196.186.154:8080了
		//修改完必须重启项目
		proxy: {
			   //这个一般是公共具备的接口路径
		       '/index': {
				//这个地址是后台api的地址
		        target: process.env.VUE_APP_URL,
		        ws: true,
		        changeOrigin: true
		      }
		    }
	}
};


.env

VUE_APP_URL=http://139.196.186.154:8080