1.在项目根目录下创建.env系列文件。.env.dev模式用于开发环境。当启用开发环境时，会引用该文件中的配置；.env.test模式用于测试环境；.env.production模式用于生产环境。二、配置文件1、开发环境#开发环境NODE_ENV='dev'#api前缀VUE_APP_BASE_API='/dev'#url地址VUE_APP_BASE_URL='http://192.168.1.1:8080'2.测试环境#开发环境NODE_ENV='test'#apiprefixVUE_APP_BASE_API='/test'#url地址VUE_APP_BASE_URL='http://xxx.xxx.x.x:8080'3.生产环境#生产环境NODE_ENV='production'#apiprefixVUE_APP_BASE_API='/prod'#url地址VUE_APP_BASE_URL='http://xxx.xxx.x.x:8080'3.在axios包中配置const服务=axios.create({//第一个baseURL:process.env.VUE_APP_BASE_API,//第二个生产环境不需要代理，其他环境需要代理设置为空baseURL:["production"].includes(process.env.NODE_ENV)?process.env.VUE_APP_BASE_URL:'',timeout:60000//timeout})//process.env.NODE_ENV//访问环境//process.env.VUE_APP_BASE_API//访问API前缀//process.env.VUE_APP_BASE_URL//访问environmenturl地址4.在vue.config.js文件中配置跨域代理module.exports={devServer:{host:'0.0.0.0',open:true,proxy:{[process.env.VUE_APP_BASE_API]:{//Type1target:process.env.VUE_APP_BASE_URL,changeOrigin:true,pathRewrite:{[`^${process.env.VUE_APP_BASE_API}`]:'',//[`^${process.env.VUE_APP_BASE_API}`]:process.env.VUE_APP_BASE_API,//如果接口需要携带此前置戳，则添加并替换为空}},'/admin':{//第二个目标：process.env.VUE_APP_BASE_URL,changeOrigin:true,pathRewrite:{'^/admin':'/admin'//如果接口需要带这个前面的戳，就加上，替换为空}},},disableHostCheck:true}}五、package.json文件中的配置"scripts":{"dev":"vue-cli-serviceserve--modedev",//启动开发环境"test":"vue-cli-serviceserve--modetest",//启动测试环境"build:dev":"vue-cli-servicebuild--modedev",//打开开发包"build:test":"vue-cli-servicebuild--modetest",//构建测试包"build":"vue-cli-servicebuild--modeproduction",//打印生产包"lint":"vue-cli-servicelint"},//注意：--modedev中的dev名称取决于.env的文件名.devdev注意点：api接口不再需要拼接地址//配置前：exportconstgetLogin=(data)=>post(`${url}/auth/login`,data);//配置后：exportconstgetLogin=(data)=>post('/auth/login',data);
