Actualmente estoy trabajando en un proyecto con este perfil de tiempo de compilación. Así es como aparece el perfil de construcción inicial.

 SMP ⏱ General output time took 3 mins, 16.82 secs SMP ⏱ Plugins InjectManifest took 21.066 secs ExtractCssChunksPlugin took 4.73 secs LimitChunkCountPlugin took 1.84 secs DefinePlugin took 0.423 secs ReactLoadablePlugin took 0.122 secs CopyPlugin took 0.085 secs ContextReplacementPlugin took 0.077 secs StatsPlugin took 0.002 secs SMP ⏱ Loaders extract-css-chunks-webpack-plugin, and css-loader, and postcss-loader, and resolve-url-loader, and sass-loader took 3 mins, 9.78 secs module count = 342 css-loader, and postcss-loader, and resolve-url-loader, and sass-loader took 3 mins, 9.77 secs module count = 342 modules with no loaders took 45.23 secs module count = 3304 babel-loader took 42.55 secs module count = 786 url-loader, and image-webpack-loader took 5.28 secs module count = 402 file-loader took 1.58 secs module count = 53 url-loader took 0.103 secs module count = 3

Es grande pero aún aceptable para la construcción inicial.

Sin embargo, cualquier cambio posterior en el modo de reloj da como resultado cerca de la mitad del tiempo, es decir, 1,5 minutos. Las razones son variables a veces. Para un cambio de JS, a veces es CopyPlugin y, a veces , babel-loader , ambos tardan 1,5 minutos y un cambio de SASS tarda 1,5 minutos para un sass-loader . Esto se debe a un proceso denominado basic chunk optimization . Aquí donde la construcción se atasca durante mucho tiempo. Después de mucho buscar, encontré la solución. Estaba usando este complemento. babel-plugin-dinamica-importación-nodo

Esto redujo el tiempo de recopilación del modo reloj de 1,5 minutos a 2 segundos y resolvió mi problema. Sin embargo, lo que me desconcierta es que esta solución era para Webpack 1 y estamos usando Webpack 4. ¿Hay alguna configuración/complemento que ya lo haga? Dado que la solución del complemento tiene 4 años, es muy probable que Webpack haya agregado estas optimizaciones a sus versiones posteriores. ¿Alguien puede explicarme cómo funciona este complemento y hace que las compilaciones sean más rápidas?

Disculpas de antemano, si me falta un básico de Webpack.