vue项目之.env文件.env.dev、test、pro

.env文件是vue运行项目时的环境配置文件。

.env: 全局默认配置文件,所有环境(开发、测试、生产等)均会加载并合并该文件

vue项目之.env文件.env.dev、test、pro_第1张图片

.env.development(开发环境默认命名)

开发环境的配置,文件名默认为.env.development,如果需要改名也是可以的,比如改成.env.dev,但是这时就需要在启动项目时候在执行脚本后面加上对应的模式

如启动项目npm run dev 是启动项目,如果启动之后想要获取配置开发环境变量,就需要变成

npm run dev --mode dev

vue项目之.env文件.env.dev、test、pro_第2张图片

.env.test(测试环境默认命名)

这个也是同理,默认命名是.env.test,也可以改成其他名字,如.env.tes,但是需要执行测试相关的脚本命令时也需要加上对应模式 --mode tes

如打包到测试环境:npm run build:test后面要加上--mode tes,前面的build是打包命令可以自己随便命名,符合规范即可

vue项目之.env文件.env.dev、test、pro_第3张图片

.env.production(生产环境默认命名)

这个也是同理,一般用于配置生产打包配置

process.env.NODE_ENV

process.env包含着关于系统环境的信息,而NODE_ENV一般由用户自己定义,一般用于判断当前的环境变量,vue项目中任何文件内应该都能获取到,如果不改默认开发环境下process.env.NODE_ENV=“development”,如果在上面的配置环境中修改之后并启动对象的模式他就会变成你配置的相应变量,如此处在.env.development文件中将NODE_ENV变成dev_dev,那么我们在启动项目之后process.env.NODE_ENV获取的变量也会变成dev_dev,(此处需要配置文件的名字是默认的,否则启动的时候就要加上对应的模式才能获取到你配置对应变量)

关于命名

文件命名

环境变量文件命名可以自己随便命名,别太离谱就行,然后执行脚本的时候加上--mode (文件名即可)

环境变量命名

只有 NODE_ENV,BASE_URL 和以 VUE_APP_ 开头的变量将通过 webpack.DefinePlugin 静态地嵌入到客户端侧的代码中。即自定义属性只能以VUE_APP_开头

vue项目之.env文件.env.dev、test、pro_第4张图片

vue项目之.env文件.env.dev、test、pro_第5张图片

vue项目之.env文件.env.dev、test、pro_第6张图片

你可能感兴趣的:(nodejs,vue.js,前端,javascript)