Voté esta pregunta cuando la vi por primera vez, creo que definitivamente debería hacerse en la producción.
Desafortunadamente, componentChunkName
(la ruta de la plantilla en cuestión) es generada por Gatsby en createPage
y no es manejada por webpack.
El código que genera componentChunkName
está aquí: github
Traté de modificar el código de la siguiente manera:
const { kebabCase } = require(`lodash`)
const path = require(`path`)
+ const uuidv5 = require(`uuid/v5`)
const { store } = require(`../redux`)
const generateComponentChunkName = componentPath => {
const program = store.getState().program
let directory = `/`
if (program && program.directory) {
directory = program.directory
}
const name = path.relative(directory, componentPath)
- return `component---${kebabCase(name)}`
+ return process.env.NODE_ENV === `production`
+ ? `component---${uuidv5(name, uuidv5.URL)}`
+ : `component---${kebabCase(name)}`
}
exports.generateComponentChunkName = generateComponentChunkName
Esto oculta con éxito todos los nombres de componentes en la compilación de producción:
app: Array [ "/app-e593b3d93932ed3a0363.js" ]
"component---11d478fe-6a55-579c-becf-625ab1e57cf4": Array [ "/component---11d478fe-6a55-579c-becf-625ab1e57cf4-76c90ae50035c52657a0.js" ]
"component---15c76861-b723-5e0a-823c-b6832aeeb0a0": Array [ "/component---15c76861-b723-5e0a-823c-b6832aeeb0a0-18eb457ba6c147e1b31b.js" ]
...
Ninguna de las pruebas de unidades locales falló, mi prueba de hacer clic alrededor hasta que algo se rompe tampoco ha arrojado ningún error. Podría presentar un RP más tarde hoy para ver si los mantenedores tienen algunas ideas sobre por qué esto no es una buena idea.
Editar : abrí un problema en su lugar: github , puedes suscribirte al problema para ver cómo se resuelve.