0

tengo una api key que según la documentación oficial debo guardar con el siguiente nombre

MIX_GOOGLE_GEOCODER_API_KEY=

en mi archivo .env para luego acceder a ella mediante

let googleGeoCoderApiKey = process.env.MIX_GOOGLE_GEOCODER_API_KEY;

lo cual estoy haciendo, el mismo IDE me da la sugerencia ya incluso mostrando la API key, esa variable está incluida en un archivo javascript que está minificado por mix de la siguiente manera

<script src="{{asset(mix('js/maps/franchise-map.min.js'))}}"></script>

y en mi webpack.mix.js lo estoy llamando de la siguiente forma

mix.minify([
    'public/js/maps/franchise-map.js',
])
    .version();

luego de tener todo esto, hago limpieza de la cache de config y ejecuto el comando npm run production, sin embargo, en el navegador obtengo el siguiente error:

franchise-map.min.js?id=1ed23d100abe226aaceb:1 Uncaught ReferenceError: process is not defined at franchise-map.min.js?id=1ed23d100abe226aaceb:1:227

cómo puedo corregir este problema?

2
  • Estás seguro de que el path está bien? Generalmente los archivos están en resources/js mix.minify([ 'public/js/maps/franchise-map.js', ]) Commented el 11 ene. 2022 a las 13:19
  • @porloscerrosΨ sí, está correcto el path, tengo otros plugins en el mismo script que están funcionando
    – Andre
    Commented el 11 ene. 2022 a las 13:56

1 respuesta 1

1

La documentación oficial que linkeas menciona dos convenciones que aplican:

  1. manejar las variables de entorno en un archivo .env
  2. de entre las definidas en aquel archivo, solamente tomar en cuenta aquellas con prefijo MIX_

Los demás supuestos que hiciste no dices de dónde vienen, pero pienso que son erróneos.

Primero, mix procesa (en el sentido de transpilar-concatenar-minificar y hacer la sustitución de variables de entorno) desde resources y hacia public. Esto no está escrito a fuego, pero es la práctica recomendada:

let mix = require('laravel-mix');

mix.js('resources/js/app.js', 'js')
   .sass('resources/sass/app.scss', 'css');

Lo que estás haciendo hoy funciona, anecdóticamente, porque al sufijar (via .version()) y usar minify (lo cual pone el sufijo .min) en rigor la fuente y la salida de la compilación son distintas. Tienes que pensar que lo que esté en public tus visitantes lo pueden abrir via browser. Si necesitas pasar esos scripts por laravel mix significa que no se trata de la salida final, y por tanto no tienen nada que hacer en public.

Segundo, comandos como minify o combine están pensados para cuando tienes un script, plugin, dependencia, etc legacy que es inviable de incorporar a la lógica principal. Por ejemplo, cuando se trata de un montón de globales en un script que no tiene exports de ninguna clase, así que no puedes requerirlo o importar de él.

Mix no intentará procesar ese archivo. Nada de sustitución de variables de entorno, transpilación, tree shaking. Se limita a operaciones que no conllevan parsear el contenido.

En cualquier otro caso, se usa .js(), y con ese comando le dejas a mix la responsabilidad de generar un build óptimo. Algo que sabe hacer de sobra.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.