Cómo usar dotenv con Vue.js

Te recomendamos que revises esta resolución en un ambiente controlado antes de enviarlo a producción, un saludo.

Solución:

Si su proyecto fue creado usando Vue CLI 3no es necesario usar dotenv para obtener variables de entorno.

Para obtener variables de entorno dentro .env archivo en su proyecto:

1. Colocando el .env archivo en la raíz de su proyecto.

2. En el .env archivo, especificando variables de entorno con “VUE_APP_” prefix.

   VUE_APP_SOMEKEY=SOME_KEY_VALUE.

3. Finalmente, puede acceder a ellos con process.env.* en el código de su aplicación.

   console.log(process.env.VUE_APP_SOMEKEY) // SOME_KEY_VALUE

Referencia: Vue CLI 3 – Variables de entorno y modos

Al usar Vue CLI 2, debe usar los archivos dev.env.js y prod.env.js ubicados en la carpeta de configuración.

Vue CLI 2 no admite el uso de archivos .env, sin embargo, Vue CLI 3 sí lo hace.

// /config/prod.env.js
'use strict'
module.exports = 
  NODE_ENV: '"production"',
  SERVER_URI: "http://someremoteuri:3333/api/v1"

// /config/dev.env.js
'use strict'
module.exports = 
  NODE_ENV: '"development"',
  SERVER_URI: "http://localhost:3333/api/v1"

Comentarios y valoraciones

Si estás contento con lo expuesto, eres capaz de dejar un artículo acerca de qué le añadirías a esta división.

---

---

Utiliza Nuestro Buscador