Additional .env mode

[xLinley]

Hi,
I would like to have a staging mode for my application, however from my understanding by default quasar only provides a dev mode and a production mode.

Right now when i launch the command "quasar dev" the .env file gets chosen and when i run "quasar build" the .env.production file gets chosen; this is all done automatically.

How can i configure a third file (.env.staging), and how can i run in dev and build the dist using this .env.staging file?

Thanks

[MilosPaunovic]

What I do in my projects is use dotenv package, create parser file:

const dotenv = require("dotenv");

const files = {
  ...dotenv.config({ path: "./.env" }).parsed,
  ...dotenv.config({ path: `./.env.${process.env.ENVIRONMENT}` }).parsed,
  ...dotenv.config({ path: `./.env.${process.env.ENVIRONMENT}.local` }).parsed
};

module.exports = function () {
  for (key in files) {
    if (typeof files[key] !== "string") {
      files[key] = JSON.stringify(files[key]);
    }
  }
  return files;
};

Then import that parser into quasar.conf.js

const parser = require('PATH_TO_PARSER_FILE');

build: {
  env: parser(),
}

Then create scripts in package.json:

 "dev:staging": "cross-env ENVIRONMENT=staging quasar dev",
 "prebuild:staging": "npm run lint",
 "build:staging": "cross-env ENVIRONMENT=staging quasar build",

And, finally, create .env.staging file with variables I need for that environment. This way you can crete as many different envirnments as you need.

Do keep in mind this is for Quasar v1.

[xLinley]

Wonderful answer, easily fixed my issue

[xLinley]

Tested with Quasar v2.0.3 and with a few ESLint tweaks this answer still works perfectly fine

[mohanprasathsj]

Is there is any solution for v2 available now besides hardcoding the variables in quasar.conf.js?

[metalsadman]

@mohanprasathsj this solution...

[egloeckle]

Still the most simple solution I have found, however for vite 5/ esm the following changes need to be made:

parser.mjs

import * as dotenv from "dotenv";

const files = {
  ...dotenv.config({ path: './.env' }).parsed,
  ...dotenv.config({ path: `./.env.${process.env.ENV_FILE}` }).parsed,
  ...dotenv.config({ path: `./.env.${process.env.ENV_FILE}.local` }).parsed,
};

export const parser = () => {
  for (let key in Object.keys(files)) {
    if (typeof files[key] !== 'string' && files[key] !== undefined) {
      files[key] = JSON.stringify(files[key]);
    }
  }
  return files;
};

Then to import the parser into quasar.conf.js:

import { parser } from './parser.mjs';

Everything else is unchanged from @MilosPaunovic solution.