lo que trato de hacer es definir una variable de URL base para mi API a la que se puede llamar en todas partes en la aplicación nuxt. por ejemplo, estoy tratando de llamar a una imagen desde mi almacenamiento API como se muestra a continuación
<img :src="`${baseUrl}/****/****.png`">Asumiendo que puedo definir la variable, entonces no necesito cambiar cada url de img cuando cambió el dominio API. o estaría muy agradecido por presentar una mejor manera de llamar a la imagen desde el almacenamiento API. por cierto, estoy usando Laravel como API.
Puede usar uno de los runtimeConfig para esto, publicRuntimeConfig o privateRuntimeConfig según sus requisitos
nuxt.config.js
export default { publicRuntimeConfig: { baseURL: 'https://nuxtjs.org' }, privateRuntimeConfig: { apiSecret: 'something_private' } } Una vez agregada, esta variable estará disponible en $config en su aplicación Nuxt como se muestra a continuación
en plantillas
<template> <p>Our Url is: {{ $config.baseURL}}</p> </template>En lugares donde usa el contexto (complementos, asyncData, etc.)
<script> asyncData ({ $config: { baseURL } }) { const posts = await fetch(`${baseURL}/posts`) .then(res => res.json()) } </script>