Quasar - 支持多种环境答案

【问题标题】：Quasar - Support multiple environmentsQuasar - 支持多种环境
【发布时间】：2020-12-08 20:29:03
【问题描述】：

我正在尝试创建具有多种环境的项目：显然，staging、prod、test + development。使用 Vuejs 非常简单

vue-cli-service build --mode staging

并创建.env.staging 文件。

请注意，应该从 quasar.conf 文件访问 process.env 以便为每个 env 设置不同的 publicPath。

如何在 Quasar 实现这种行为？

谢谢

【问题讨论】：

标签： javascript vue.js vuejs2 quasar-framework quasar

【解决方案1】：

查看@quasar/qenv 扩展，它似乎支持多种环境。 https://github.com/quasarframework/app-extension-qenv

另一种方法，因为我正在使用 Firebase 托管，并且暂存和生产托管都在同一个项目中......我有使用 quasar build -d（调试模式）作为暂存和 quasar build 作为生产的想法，每个都有它自己的dist 文件夹，我相应地在quasar.conf.js 中设置了一个 DEPLOY_MODE 环境变量：

build: {
      distDir: ctx.debug ? `dist/${ctx.modeName}-dev` : `dist/${ctx.modeName}`,
      env: {
        DEPLOY_MODE: ctx.prod && !ctx.debug ? 'PRODUCTION' : (ctx.prod && ctx.debug ? 'STAGING' : 'DEV')
      },
...

我使用了dotenv 扩展名并拥有一个 .env.prod 和 .env.dev 文件。在 .env.prod 中，我定义了生产和暂存特定键，例如API_KEY=blah, API_STAGING_KEY=blah，然后在我的引导文件中，我使用 process.env.DEPLOY_MODE 来确定在我的生产环境文件。

if(process.env.DEPLOY_MODE === 'staging') {
   const API_KEY = process.env.API_STAGING_KEY
} else {
   const API_KEY = process.env.API_KEY
}

我怀疑@qenv 更优雅，但这对于我的简单项目来说已经足够了。

【讨论】：