2016-10-03 3 views
3

Я смотрел файл конфигурации webpack 10, и я не совсем понимаю, что произойдет, если дано более одной точки входа (как в примере ниже).webpack: несколько точек ввода

Это то, что точки входа служат отправными точками для поиска зависимости, а затем объединение результирующих зависимостей - это то, что заканчивается в комплекте?

'use strict'; 

var webpack = require('webpack'); 

module.exports = { 

    entry: [ 
     'webpack/hot/only-dev-server', 
     './index.js' 
    ], 
    output: { 
     path: __dirname + '/build', 
     publicPath: __dirname + "/build/", 
     filename: 'bundle.js' 
    }, 
    plugins: [ 
     new webpack.HotModuleReplacementPlugin(), 
     new webpack.NoErrorsPlugin() 
    ] 


}; 

Я смотрел на doc, но это не объясняет, что делает выше конфигурации.

Кроме того, here написано:

Если вы передаете массив: Все модули загружаются при запуске. Последний один экспортируется.

entry: ["./entry1", "./entry2"] 

В чем разница между загрузкой модуля и экспорта один?

ответ

9

Ровно !!

Как вы можете видеть на примере this, с несколькими точками входа вы создаете 2 или более пучков, начиная с выбранной точки входа. Однако вы probabliy дублируйте (или более) ваш код зависимостей в ваших пакетах. Ваша конфигурация в настоящий момент выполняет эту задачу без какой-либо оптимизации.

В приведенном примере используется общий плагин chunk, который создает другой пакет с общим кодом записей (для включения перед другими), полезный для многостраничного webapp.

Если вы хотите, чтобы добавить общий фрагмент плагина, вы можете просто добавить этот код в вашу конфигурацию:

plugins: [ 
    new CommonsChunkPlugin({ 
     filename: "commons.js", 
     name: "commons" 
    }) 
] 

На this страницы можно найти еще пример (как несколько свободных городской фрагмент)

Что касается ввода аргумент:

  • , если вы передаете строку (entry: 'entry.js'), веб-пакет создайте один пучок, начиная с него.
  • Если вы передаете массив (entry: ['entry1.js', 'entry2.js']), он создает пакет, начиная с entry2, named entry2 и загружая (и анализируя) entry1.
  • Если вы передаете объект (entry: {entry1: 'entry1.js', entry2: 'entry2.js'}), он создает два разных набора, начиная с записей и именуемых как ключ ввода объекта.
  • , если вы используете смешанный режим, подобный этому entry: {entry1: 'entry1.js', entry2: ['entry2_1.js', 'entry2_2.js'] }, веб-пакет создает пакет с именем entry1, начиная с entry1.js, и другой набор с именем entry2, начиная с entry2_2.js, но загружая firt entry2_1.js.

Обратите внимание, что, передавая массив записей, только последний экспортируется, остальные js загружаются только.

+0

Большое спасибо! В чем разница между «загрузкой» и «экспортом»? в «обратите внимание, что, передавая массив записей, только последний экспортируется, остальные js загружаются только». ? – jhegedus

+1

Экспорт означает, что эти компоновки JavaScript, когда они загружаются, обрабатываются только. Объясняется (аналогичным образом) в этом вопросе http://stackoverflow.com/questions/32511853/webpack-export-classes-from-multiple-entry-files – TeoMatthew

0

Ну, он обрабатывает каждую точку входа отдельно. Он будет включать все зависимости, которые ему нужны, это означает, что если обе точки входа используют jquery. Оба получат его в свой собственный пакет. Но, как сказано выше, вы можете использовать плагин commonchunks.в какой-то момент (как вы можете решить, сколько нужно) переместите несколько использованных модулей на определенный общий модуль

Смежные вопросы