Me da la idea general de que elCommonsChunkPlugin mira todos los puntos de entrada, comprueba si hay paquetes / dependencias comunes entre ellos y los separa en su propio paquete.

Entonces, supongamos que tengo la siguiente configuración:

...
enrty : {
    entry1 : 'entry1.js', //which has 'jquery' as a dependency
    entry2 : 'entry2.js', //which has 'jquery as a dependency
    vendors : [
        'jquery',
        'some_jquery_plugin' //which has 'jquery' as a dependency
    ]
},
output: {
    path: PATHS.build,
    filename: '[name].bundle.js'
}
...

Si hago un paquete sin usarCommonsChunkPlugin

Terminaré con 3 nuevos paquetes de archivos:

entry1.bundle.js que contiene el código completo deentry1.js yjquery y contiene su propio tiempo de ejecuciónentry2.bundle.js que contiene el código completo deentry2.js yjquery y contiene su propio tiempo de ejecuciónvendors.bundle.js que contiene el código completo dejquery ysome_jquery_plugin y contiene su propio tiempo de ejecución

Esto obviamente es malo porque potencialmente voy a cargarjquery 3 veces en la página, así que no queremos eso.

Si paquete usandoCommonsChunkPlugin

Dependiendo de qué argumentos pasoCommonsChunkPlugin ocurrirá cualquiera de los siguientes:

CASO 1 : Si paso{ name : 'commons' } Terminaré con los siguientes archivos de paquete:

entry1.bundle.js que contiene el código completo deentry1.js, un requisito parajq,uery y no contiene el tiempo de ejecuciónentry2.bundle.js que contiene el código completo deentry2.js, un requisito parajquery y no contiene el tiempo de ejecuciónvendors.bundle.js que contiene el código completo desome_jquery_plugin, un requisito parajquery y no contiene el tiempo de ejecucióncommons.bundle.js que contiene el código completo dejquery y contiene el tiempo de ejecución

De esta manera, terminamos con algunos paquetes más pequeños en general y el tiempo de ejecución está contenido en elcommons haz. Bastante bien pero no ideal.

CASO 2: Si paso{ name : 'vendors' } Terminaré con los siguientes archivos de paquete:

entry1.bundle.js que contiene el código completo deentry1.js, un requisito parajquery y no contiene el tiempo de ejecuciónentry2.bundle.js que contiene el código completo deentry2.js, un requisito parajquery y no contiene el tiempo de ejecuciónvendors.bundle.js que contiene el código completo dejquery ysome_jquery_plugin y contiene el tiempo de ejecución.

De esta manera, nuevamente, terminamos con algunos paquetes más pequeños en general, pero el tiempo de ejecución ahora está contenido envendors haz. Es un poco peor que el caso anterior, ya que el tiempo de ejecución ahora está envendors haz.

CASO 3: Si paso{ names : ['vendors', 'manifest'] } Terminaré con los siguientes archivos de paquete:

entry1.bundle.js que contiene el código completo deentry1.js, un requisito parajquery y no contiene el tiempo de ejecuciónentry2.bundle.js que contiene el código completo deentry2.js, un requisito parajquery y no contiene el tiempo de ejecuciónvendors.bundle.js que contiene el código completo dejquery ysome_jquery_plugin y no contiene el tiempo de ejecuciónmanifest.bundle.js que contiene requisitos para cada otro paquete y contiene el tiempo de ejecución

De esta manera, terminamos con algunos paquetes más pequeños en general y el tiempo de ejecución está contenido en elmanifest haz. Este es el caso ideal.

Lo que no entiendo / No estoy seguro de entender

EnCASO 2 ¿Por qué terminamos con elvendors paquete que contiene tanto el código común (jquery) y lo que quedaba delvendors entrada (some_jquery_plugin)? Desde mi entendimiento, lo que elCommonsChunkPlugin lo que hice aquí fue que reunió el código común (jquery), y dado que lo forzamos a enviarlo alvendors paquete, tipo de "fusionó" el código común en elvendors paquete (que ahora solo contenía el código desome_jquery_plugin)Por favor confirme o explique.

EnCASO 3 No entiendo lo que pasó cuando pasamos{ names : ['vendors', 'manifest'] } al complemento ¿Por qué / cómo fue elvendors paquete mantenido intacto, que contiene ambosjquery ysome_jquery_plugin, cuandojquery es claramente una dependencia común, y por qué se generómanifest.bundle.js archivo creado de la manera en que fue creado (que requiere todos los demás paquetes y que contiene el tiempo de ejecución)?