配置备用环境变量
在根目录下创建envdevelopment文件,并添加环境变量
VUE_APP_SERVER_ID = 0
在根目录下创建envproduction文件,并添加环境变量
VUE_APP_SERVER_ID = 1
创建自动化部署脚本
在packagejson同级目录下创建文件夹deploy
在deploy文件下创建configjs和serversjs和indexjs
serversjs:配置服务器相关信息
configjs:发布前的一些处理
indexjs:发布到服务器的处理逻辑
添加packagejson中的scripts命令
效果如下webpack本身有dev和prodcution两套环境,我们的项目还有uat环境,只有两套环境并无法满足项目开发的需要,因为我参考webpack搭建dev环境的方式搭建了uat环境。
首先,找到项目的packagejson,找到scripts,加上uat指令的定义,
很容易理解,当我们执行npm run dev时候执行node中build目录的dev-serverjs,所以我们定义了uat指令执行uat-serverjs。
uat-serverjs
webpackuatconfjs
uatenvjs
找到config下方的indexjs
在dev下方增加uat的配置,配置如下:
这样,搭建了dev,uat和production三套环境,我们在devenvjs增加API_ROOT:
在prodenvjs增加API_ROOT:
在配置api接口的文件中,将baseURL设置成:
这里以axios的设置为例,项目根据实际情况调整。
如此,当我们运行
指向的域名服务器是
当我们运行
指向的域名服务器是
这是前面配置的自定义指令,可根据项目实际情况定义自己的指令
当我们运行
指向的域名服务器是
打包项目的时候,打包的是根据服务器获取到相应的接口,我们就不用调来调去,也不容易出错,有问题欢迎留言讨论。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)