es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Mapas de origen, informes de errores y compilaciones de producción

18 Jul, 2023 Programación

¿Cuál es la mejor manera de generar mapas de origen para herramientas de informes de errores pero sin exponerlos públicamente en la versión de producción?

Sé que los mapas de origen exponen tu código fuente, así que quiero evitar que sean públicos.

Mi enfoque hasta ahora ha sido generar mapas de origen utilizando la siguiente configuración en nuxt.config.js:

// Configuración de compilación (https://go.nuxtjs.dev/config-build)
build: {
  extend(config, { isClient }) {
    // Extender solo la configuración de webpack para el paquete del cliente
    if (isClient) {
      config.devtool = isClient ? 'source-map' : 'inline-source-map'
    }
  },
},

Lo cual funciona muy bien para generar los mapas de origen que necesito y utilizar la herramienta de errores.

El problema surge cuando despliego esos archivos en un CDN estático como S3, y ejecuto el siguiente comando:

aws s3 cp ./dist "s3://$DOMAIN" --recursive --no-progress --exclude '*.js.map'

Entonces, obtengo errores como los siguientes en relación a la falta de esos mapas:

DevTools no pudo cargar el mapa de origen: No se pudo cargar el contenido de https://example.com/_nuxt/c079cc9.js.map: error HTTP: código de estado 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools no pudo cargar el mapa de origen: No se pudo cargar el contenido de https://example.com/_nuxt/5823d8f.js.map: error HTTP: código de estado 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools no pudo cargar el mapa de origen: No se pudo cargar el contenido de https://example.com/_nuxt/92bfe22.js.map: error HTTP: código de estado 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools no pudo cargar el mapa de origen: No se pudo cargar el contenido de https://example.com/_nuxt/82d7903.js.map: error HTTP: código de estado 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools no pudo cargar el mapa de origen: No se pudo cargar el contenido de https://example.com/_nuxt/348e9ee.js.map: error HTTP: código de estado 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

Así que idealmente me gustaría generar esos mapas pero evitar esas solicitudes cuando se implementa en producción.

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para generar mapas de origen para herramientas de informes de errores sin exponerlos públicamente en la compilación de producción, puedes usar la opción devtool de webpack. En tu archivo nuxt.config.js, proporciona la siguiente configuración en la propiedad build:

    build: {
  extend(config, { isDev, isClient }) {
    if (isDev && isClient) {
      config.devtool = 'eval-source-map'
    }

    if (!isDev && isClient) {
      config.devtool = 'hidden-source-map'
    }
  }
}

    Esto genera mapas de origen en modo de desarrollo, pero en modo de producción genera un archivo de mapa de origen separado que no se expone públicamente.

    Cuando estés implementando en producción, usa la opción --no-source-map para deshabilitar la generación de mapas de origen. Por ejemplo, usa el siguiente comando:

    nuxt build --no-source-map

    De esta manera, puedes evitar generar archivos de mapa de origen durante la compilación de producción y esto evita cualquier exposición de tu código fuente.

Comments are closed.