vue-cli配置开发、测试、生产环境

vue-cli配置开发、测试、生产环境_第1张图片

NODE_ENV = 'development'
VUE_APP_MODE = 'development'
VUE_APP_API_URL=https://a
outputDir = test

NODE_ENV:可以设置为其他值,比如"test",但是打包后的目录结构和"production"不一样,所以还是设置为"production",通过"VUE_APP_MODE"变量来区分环境
VUE_APP_MODE:线上测试环境
VUE_APP_API_URL:api调用地址
outputDir:打包生成的文件夹名称,默认是'dist'

开发环境(.env)

NODE_ENV = 'development'
VUE_APP_MODE = 'development'
VUE_APP_API_URL=https://a

测试(.env.test)

NODE_ENV = 'production'
VUE_APP_MODE ='test'
VUE_APP_API_URL=https://y
outputDir = test

修改vue.config.js中的打包输出目录

vue-cli配置开发、测试、生产环境_第2张图片

生产(.env.production)

NODE_ENV = 'production'
VUE_APP_MODE = 'production'
VUE_APP_API_URL=https://a

package.json

vue-cli配置开发、测试、生产环境_第3张图片

打包命令

运行npm run test或者npm run publish(同时生成测试和生产环境的包)
vue-cli配置开发、测试、生产环境_第4张图片

你可能感兴趣的:(vue-cli配置开发、测试、生产环境)