Environment variables

  • Hi Scott,

    I won’t store them there of course, I was using .env for other projects and I just wanted to have some consistency. ☺

    Thanks for the article, that really helps with the extendWebpack approach!

  • Currently there is an official extension for using environement variables.

    quasar ext add @quasar/dotenv

  • There are two @DarkLite1 ! 😄

    This one too:

    $ quasar ext add @quasar/qenv

    It is a bit more flexible than dotenv.


  • Is that one rendered faster so it can be used in the quasar.conf.js file to set for example a port number as mentioned here?

  • No, unfortunately it doesn’t.

    If you need get env vars in the config, you’ll need to install dotenv and use it as you normally would with a Node app. But, what port are you trying to set?


  • I found the answer here. For anyone interested you should install the app-extension-qenv and then to access the environment variables you can use this advice:

    So, no. You cannot access process.env from within quasar.conf.js. However, you can access everything that will be going into process.env – use build.env from within quasar.conf.js. Everything in build.env will be converted to process.env (build-time, vs run-time).

  • @s-molinari I’m just trying to have Quasar use the ports defined in the environment. So when I use a Docker container later on with its own environment in it, say port number and some API keys, I would like Quasar to respect that.

  • What are the API keys for? Ports don’t need to be hidden, so no real need for .env there.


  • The API keys are for Azure authentication and contain the Application Client ID. This is indeed not sensitive information but still, I would like to configure things in one place.

    The .env file also allows fine grained control by not having to set these things in the app. So after all I think it’s best to create a simple .env file and use it with the standard dotenv library.

    They suggest to preload it like this:

    node -r dotenv/config your_script.js

    Is there a way to do this with Quasar? And where is the production port defined in Quasar? I only see this for the devServer:

        devServer: {
          https: false,
          port: 8080,
          open: true // opens browser window automatically

  • @DarkLite1 did you managed?

Log in to reply