Mi complemento, env.js:
export default async (_ctx, inject) => { const resp = await fetch('/config.json') const result = await resp.json() inject('env', result) // eslint-disable-next-line no-console console.log('env injected', result) return result }Luego, una idea fue usar sus datos dentro de nuxt.config.js para inyectar en publicRuntimeConfig:
import env from './plugins/env.js' publicRuntimeConfig: { test: env, },Luego, en una consola del navegador, lo estoy comprobando:
this.$nuxt.$configme muestra:
en lugar de un valor, aunque this.$nuxt.$env muestra los valores correctos:
¿Qué ocurre?
ACTUALIZAR 1
Intenté la sugerencia de Tony:
// nuxt.config.js import axios from 'axios' export default async () => { const resp = await axios.get('/config.json') const config = resp.data return { publicRuntimeConfig: { config } } }No puede obtener config.json , pero si lo apunto a un recurso externo: "https://api.openbrewerydb.org/breweries", funciona.
La intención de esta pregunta es tener config.json donde un usuario simplemente pueda cambiar los valores de las variables allí (desde un código compilado) y cambiar los puntos finales sin un proceso de reconstrucción.
En nuxt.config.js , su variable env es un módulo de JavaScript , donde la exportación predeterminada es la función que Nuxt debe ejecutar automáticamente en el contexto de un complemento. La importación del script del complemento no ejecuta automáticamente esa función. Incluso si ejecutó manualmente esa función, no tendría sentido usar un accesorio inyectado como una configuración de tiempo de ejecución porque los datos ya están disponibles como un accesorio inyectado.
Si solo desea exponer config.json como una configuración de tiempo de ejecución en lugar de un accesorio inyectado, mueva el código del complemento a una configuración asíncrona :
// nuxt.config.js export default async () => { const resp = await fetch('/config.json') const config = await resp.json() return { publicRuntimeConfig: { keycloak: config } } }