注意：文章中使用的 HBuilderX 版本为 4.24。

使用 HBX 创建的 uni-app 项目（非CLI创建），想要定义环境变量一直是一个让人非常困扰的事情。
官方的文档 关于环境变量的说明也非常暧昧不清。

通过关键词 环境变量 检索会出现5篇相关文档：

1. #配置环境变量 - vue.config.js | uni-app官网
2. #判断平台 - 开发环境和生产环境 | uni-app官网
3. #环境变量 - Vue2升3指南 | uni-app官网
4. 编辑器配置 | uni-app官网
5. 真机运行常见问题@run | uni-app官网

所以我早期定义环境变量就是使用的第一个文档链接中使用 DefinePlugin 来定义环境变量的方式

// vue.config.js
module.exports = {
  chainWebpack: config => {
    config
      .plugin('define')
      .tap(args => {
        args[0]['process.env'].MY_TEST = '"test"' // 注意需要多层引号包裹
        return args
      })
  }
}

注意：注意需要多层引号包裹自定义环境变量的值。

const test = process.env.MY_TEST // test

console.table(process.env)
// (索引)  值
// NODE_ENV  development
// VUE_APP_NAME  Test-Project
// VUE_APP_PLATFORM  h5
// BASE_URL  /
// MY_TEST  test

我这边在声明环境变量时，不需要使用 VUE_APP_ 这样的前缀，但是官方的示例中是有的。如果你无法在业务代码中正确获取到，可以尝试添加 VUE_APP_ 前缀（👉 VUE_APP_MY_TEST）

嗨呀，我也开始写 uni-app 了 😂，这次在使用 uView 这个UI库的时候遇到了一个问题，就是 <u-icon> 组件使用 @click.stop 阻止冒泡事件使会提示异常：TypeError: e.stopPropagation is not a function

去看了一下组件的源码，发现 u-icon 组件的 click 事件是自定义事件，没有 event，只返回了一个 this.index，所以不能使用 .stop 来阻止冒泡，