Pass env variables from azure pipelines to Vue app in 2.6 with Quasar with readonlyrootfilesystem

Question

I have a Vue App running in 2.6 with Quasar, i'm changing the configuration of my task definition in AWS to readonlyrootfilesystem = true, the thing is, to the moment i have been using a sh script to write the env variables to a file and use them with window.configs, but with readonlyrootfilesystem as true, i cannot write to files.

Note: i'm new to Vue and frontend development in general

I tried a couple of things:

1 - Use variables in quasar.config file, but the azure pipelines variables don't override the variables in quasar.config

2 - Using dotenv both with override = true and without, same problem as before, when i pass the env variables to the app, it does not override

3 - Using prod.env.js and dev.env.js in /config folder, this does not seem to work since all my variables in process.env seems to stay undefined, i think it is something with using Quasar

Answer 1

You cannot directly use the expression $(var_Name) in the quasar.config file to reference the pipeline variable. This expression is only available on the pipeline task input fields, such as the inline type scrips.

If you want to use the values of pipeline variables to replace that of env variables in the quasar.config file, you can try to use a script task (such as Bash, PowerShell, CmdLine, etc..) to run the inline type script to write the values of pipeline variables into the config file. Then build and deploy your Vue App with the updated config file to your AWS server.

---