Hola amigos lectores, les quiero compartir este pequeña guía sobre como establecer las variables de entorno en un proyecto con Quasar .

Las variables de entornos son variables dinámica que pueden afectar al comportamiento de los procesos en ejecución en un ordenador y nos ayudan establecer valores sensibles que no queremos compartir en los repositorios de código o con otros compañero de equipo como contraseña de servidores de correo, claves secretas, direcciones IP, etc.

Quasar posee un mecanismo muy sencillo para guardar las variables de entorno a través del paquete dotenv.

Instalación

npm install dotenv

Configuración

Editamos el archivo /quasar.conf.js , buscamos el objeto build y le añadimos el siguiente elemento:

build: { 
    env: require('dotenv').config().parsed 
}

Por último nos aseguramos de crear el archivo .env en la raíz del proyecto, el cual almacenará las variables de entorno con el siguiente formato:

BASE_URL=http://dominio.api
DB_HOST=localhost
DB_USER=root
DB_PASS=s1mpl3

De esta forma ya tenemos nuestro proyecto configurado para usar las variables de entorno en los archivos del proyecto que así lo requieran.

Usar las variables de entorno

Las variables de entorno pueden ser accedidas desde cualquier parte de nuestra aplicación Quasar a través del objeto global process.env.

Una variable que generalmente se crea en el archivo de entorno es BASE_URL la cual utiliza la librería axios para establecer la url base de acceso a la API donde haremos las peticiones desde el frontend.

const httpClient = axios.create({
  baseURL: process.env.BASE_URL,  // Variable de entorno BASE_URL
  headers: {
    'Content-Type': 'application/json'
  }
})

De esta forma podemos acceder a todas las variables que tenemos declaradas en nuestro archivo de entorno .env

process.env.BASE_URL
process.env.DB_HOST
process.env.DB_USER
...

Espero que esta pequeña guía te sea de utilidad en la configuración de tu entorno con Quasar.