环境变量主要用于区分开发环境、测试环境和正式环境(1)安装依赖:cnpmi-Dcross-env或npmi-Dcross-env(2)package.json中的脚本新增修改到//1.删除启动和构建//2。PATH_ENV可以自定义名字,你可以随便改//3.不知道为什么npmrunprod已经测试过了,所以改成npmrundprod"scripts":{"dev":"cross-envPATH_ENV=testwebpack-dev-server--inline--progress--配置build/webpack.dev.conf.js","preprod":"cross-envPATH_ENV=preprodwebpack-dev-server--inline--progress--configbuild/webpack.dev.conf.js","dprod":"cross-envPATH_ENV=prodwebpack-dev-server--inline--progress--configbuild/webpack.dev.conf.js","btest":"cross-envPATH_ENV=测试节点构建/构建。js","bpreprod":"cross-envPATH_ENV=preprodnodebuild/build.js","bprod":"cross-envPATH_ENV=prodnodebuild/build.js"},(3)编辑'usestrict'在config/prod.env.js中让PATH_ENV='"test"'if(process.env.PATH_ENV==='preprod'){PATH_ENV='"preprod"'}elseif(process.env.PATH_ENV==='prod'){PATH_ENV='"prod"'}console.log(PATH_ENV)模块。exports={NODE_ENV:'"production"',PATH_ENV}(4)运行npmrunbtest,会打印npmrundev表示开发过程中运行测试环境的接口npmrunpreprod表示运行pre-开发过程中的发布环境npmrundprod代表开发过程中运行官方环境的接口。npmrunbtest代表打包运行测试环境。npmrunbpreprod代表打包运行预发布环境。npmrunbprod代表打包运行正式环境。(5)引入src/api文件下的环境。js/**配置编译环境和线上环境的切换*baseUrl:域名地址*routerModel:路由模式***/varShareUrl="http://#######.test.cn/接口/";//测试if(process.env.PATH_ENV==='test'){baseUrl="http://#######.test.cn/api/";//测试}elseif(process.env.PATH_ENV==='preprod'){baseUrl="http://#######.yfb.cn/api/";//preprod}elseif(process.env.PATH_ENV==='prod'){baseUrl="http://#######.zs.cn/api/";//官方}export{ShareUrl}(6)在src/api/api.js文件下importenvironment.jstoimport{baseUrl}from'@/api/environment';
