Почему после выделения кода библиотек суммарный размер билда увеличился?

Question

[Антон Антон]

Добавил в webpack.config.js такой код для выделения библиотек в отдельный бандл:

var fs = require('fs');

var package = JSON.parse(fs.readFileSync('./package.json','utf-8'));
var vendor = [];
for (var name in package.dependencies) {
  vendor.push(name);
}

module.exports = {
  entry: {
    app: './src/main.js',
    vendor: vendor
  },
  plugins: [
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor'
    })
  ]
}

Получаем:

Asset      Size  Chunks                    Chunk Names
       app.build.js   50.6 kB       0  [emitted]         app
    vendor.build.js    711 kB       1  [emitted]  [big]  vendor
          style.css     53 kB    0, 1  [emitted]         app, vendor

итого 814 кб

Если закомментировать vendor, то поучаем следующую картину:

Asset      Size  Chunks                    Chunk Names
       app.build.js    536 kB       0  [emitted]  [big]  app
    vendor.build.js   1.44 kB       1  [emitted]         vendor
          style.css    192 kB       0  [emitted]         app

итого 729 кб

Как сделать так, чтобы и модули выделить, и размер не увеличить?
Ну и заодно - как сделать так, чтобы вебпак пересобирал только app, без node-modules?

Comments

[Lynn «Кофеман»]

Вместо

var package = JSON.parse(fs.readFileSync('./package.json','utf-8'));

проще написать
var package = require('./package.json');

[Антон Антон]

Алексей Тен: спасибо :)

Answer 1

[Lynn «Кофеман»]

Подозреваю, что не все пакеты из dependencies реально используются.

В первом случае вы принудительно добавили в сборку всё, а во втором вебпак собрал только то, что нужно

Comments

[Антон Антон]

Так и есть, все дело в moment.js, вернее его локализации

Answer 2

[Антон Антон]

С помощью webpack-bundle-analyzer увидел, что это moment.js с его локализациями, с помощью
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/) убил локализации из бандла, получилось так:

Time: 12245ms
          Asset      Size  Chunks                    Chunk Names
   app.build.js   50.4 kB       0  [emitted]         app
vendor.build.js    546 kB       1  [emitted]  [big]  vendor
      style.css     53 kB    0, 1  [emitted]         app, vendor
  style.css.map  86 bytes    0, 1  [emitted]         app, vendor

итого 649 кб, т.е. даже меньше, чем без всего.