vue index.html根据环境变量加载不同js及如何使用全局变量

Maxiaobai_ing

于 2021-08-20 13:11:55 发布

阅读量2.8k

点赞数 3

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/Maxiaobai_ing/article/details/119821145

本文介绍如何在Vue应用中根据环境变量（NODE_ENV）动态加载不同的地图资源，并演示了在JavaScript中判断环境的实例。重点在于处理开发、测试和生产环境下的不同URL配置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue中静态html使用loash template使用全局变量

// An highlighted block
<% if (process.env.NODE_ENV === 'production' ) { %>
<!-- 内网地图 -->
<script src="1.js" ></script>
<% } %>
<% if (process.env.NODE_ENV === 'test' || process.env.NODE_ENV === 'development' ) { %>
  <!-- 外网地图 -->
  <script src="2.js"></script>
<% } %>
<script src="<%= BASE_URL %>sysConfig.js"></script>

顺便说一下js内部如何判断环境变量

// An highlighted block
if (process.env.NODE_ENV === 'development') {
  // 本地
  addressUrl = 'http://localhost:xx' // 本地
} else if (process.env.NODE_ENV === 'test') {
  //测试
  addressUrl = 'http://x.x.x.x:xx'
}else if (process.env.NODE_ENV === 'production') {
  //生产
  addressUrl = 'http://x.x.x.x:xx'
}