vue.js Quasar -支持多种环境

acruukt9  于 2023-03-09  发布在  Vue.js
关注(0)|答案(2)|浏览(296)

我正在尝试创建具有多个环境的项目:很明显,准备、生产、测试+开发。对于Vuejs来说,这是非常简单的

vue-cli-service build --mode staging

并创建.env.staging文件。
重要的是,应该从quasar.conf文件访问process.env,以便为每个env设置不同的publicPath。
我怎样才能在Quasar实现这种行为?
谢谢

erhoui1w

erhoui1w1#

看看@quasar/qenv扩展,它似乎支持多种环境。https://github.com/quasarframework/app-extension-qenv
另一种方法,因为我正在使用Firebase Hosting,并且过渡托管和生产托管都在同一个项目中...我的想法是使用quasar build -d(调试模式)作为过渡托管,使用quasar build作为生产托管,每个托管都有自己的dist文件夹,并且我相应地在quasar.conf.js中设置了DEPLOY_MODE env变量:

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,然后在 Boot 文件中,我使用process.env.DEPLOY_MODE来确定在生产env文件中使用哪些密钥。

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

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

f0brbegy

f0brbegy2#

使用dotenv,我使用这个解决方案来管理多个配置文件,您至少需要使用一个env变量(这里是ENV_VAR)。

const env = require('dotenv').config({ path: `variables.${process.env.ENV_VAR.toLowerCase()}.env` }).parsed

module.exports = function (ctx) {
  // etc.
  build: { // override quasar env
    env: {
      ...env
    },
  // etc.

您可以拥有任意数量的配置文件:
在变量.dev.env中:
VARENV=偏差
在变量.stg.env中:
变值=stg
在变量.prd.env中:
方差=预测值
您可以尝试使用此解决方案声明此ENV_VAR

export ENV_VAR=stg
 
quasar dev

注意:如果使用Docker,则必须按环境构建一个映像,或者必须在运行时构建项目。

相关问题