vue项目使用.env文件配置全局环境变量

2020-04-02 13:06:16

参考地址 vue项目使用.env文件配置全局环境变量

关于文件名：必须以如下方式命名，不要乱起名，也无需专门手动控制加载哪个文件


.env 全局默认配置文件，不论什么环境都会加载合并


.env.development 开发环境下的配置文件


.env.production 生产环境下的配置文件




 


================================================================================================


关于文件内容：


注意：属性名必须以VUE_APP_开头，比如VUE_APP_XXX


.env：




 


.env.development：




 


================================================================================================


关于文件的加载：


根据启动命令vue会自动加载对应的环境，vue是根据文件名进行加载的，所以上面说“不要乱起名，也无需专门控制加载哪个文件”


比如执行npm run serve命令，会自动加载.env.development文件


启动项目：




打印process.env属性（全局属性，任何地方均可使用）：






可见NODE_ENV被改为了development，覆盖掉了.env中的全局属性


.env中的全局属性NODE_ENV、VUE_APP_URL被覆盖，


.env中的全局属性VUE_APP_PREVIEW、VUE_APP_DEFAULT_PARAM被保留



  • 精彩推荐

  • 2017-03-22 16:26:36

    最全面的Android Webview详解

    现在很多App里都内置了Web网页（Hyprid App），比如说很多电商平台，淘宝、京东、聚划算等等，如下图

  • 2017-03-23 22:29:52

    Android开发中Handler的经典总结

    当应用程序启动时，Android首先会开启一个主线程(也就是UI线程)，主线程为管理界面中的UI控件，进行事件分发。

  • 2017-03-27 16:24:26

    laravel，gulp，Browsersync浏览器同步测试

    Browsersync能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。更重要的是 Browsersync可以同时在PC、平板、手机等设备下进项调试。您可以想象一下：“假设您的桌子上有pc、ipad、iphone、android等设备，同时打开了您需要调试的页面，当您使用browsersync后，您的任何一次代码保存，以上的设备都会同时显示您的改动”。无论您是前端还是后端工程师，使用它将提高您30%的工作效率。

  • 2017-03-28 09:27:41

    Java中Arrays的asList()方法

    Java中Arrays的asList()方法 可以将 数组转为List 但是，这个数组类型必须是 引用类型的，如果是8中基本数据类型就不可以 原因如下，引用别人的一篇文章：