0
169
Visualizações¿Deshabilitar el archivo de agrupación bundle.js que Webpack crea en React usando Create React App o Craco? O al menos obtener 'Rendimiento' para trabajar con mapas de origen
¿Cómo puedo desactivar la agrupación por completo en la aplicación Create React o Craco? Estoy tratando de usar craco para hacerlo y mi configuración para webpack es la siguiente:
configure: { /* Any webpack configuration options: https://webpack.js.org/configuration */ mode: 'development', optimization: { minimize: false, }, devtool: 'eval-source-map', },Necesito desactivar la agrupación porque incluso con los mapas de origen, el analizador de rendimiento (Waterfall) en Firefox aún muestra algunas llamadas provenientes de bundle.js, lo cual es... No es útil en absoluto ya que algunas llamadas provienen de la línea "bundle.js". 3051 %3E eval:81828" - y cuando haga clic, diga "línea no encontrada". El Árbol de llamadas en la pestaña Rendimiento también muestra nada más que llamadas bundle.js (eval:####). Cuando se hace clic en ESAS líneas, me lleva al código que se ve así:
Estoy tratando de optimizar un juego Phaser webgl y la agrupación está haciendo las cosas muy difíciles. Cualquier ayuda sería apreciada.
Ah, y otra cosa rara: al mirar el registro de Waterfall para una llamada de Phaser, generalmente comienza con el extraño "bundle.js%20line%20####%20%3E%20eval:###### roto. #", pero tiene llamadas de phaser.js debajo de eso con enlaces de trabajo a la línea de código que lo está llamando.
Dependencias relevantes de package.json:
"@craco/craco": "^7.0.0-alpha.3", "phaser": "^3.55.2", "react-dom": "^17.0.1", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", "react-scripts": "^5.0.0",1 Respostas
Responde à pergunta0
Puedes lograr esto con cracko config.
module.exports = { webpack: { configure: { output: { filename: 'static/js/[name].js' }, optimization: { runtimeChunk: false, splitChunks: { chunks(chunk) { return false; } } } } }, plugins: [ { plugin: { overrideWebpackConfig: ({ webpackConfig }) => { webpackConfig.plugins[5].options.filename = 'static/css/[name].css'; return webpackConfig; } }, options: {} } ] };