Объединение и минимизация проекта angular2, Js и Html

Question

Работа над проектом angular2 некоторое время теперь, после обновления его с углового1 (любящий angular2 btw).

Теперь я хотел бы рассказать об этом проекте, но не знаю, что лучше всего использовать для подключения поставщика? Также я вижу некоторые сообщения, в которых говорится, что они разбивают пакет на несколько файлов (например, app.bundle.js и vendors.bundle.js), а другие имеют 1 большой файл. Каков наилучший метод? Я всегда проверял, что многие файлы были лучше, потому что браузеры могут одновременно загружать несколько файлов? Вам нужно использовать задачу глотания для всего этого или что-то еще?

Также, как я могу минимизировать HTML-шаблоны в приложении angular2?

Answer 1

Вы можете использовать Webpack или Systemjs-Builder для объединения своего приложения. Есть тонны семенных проектов, из которых вы можете взять подсказки, например. this и this, и вы можете использовать this в своей задаче gulp, чтобы встроить шаблоны в свою сборку.

Answer 2

Теперь я хотел бы рассказать об этом проекте, но не знаю, что лучше всего использовать для подключения поставщика?

Все ответы на ваши вопросы будут субъективными, но на самом деле Webpack предлагает плагины и параметры конфигурации в соответствии с вашими потребностями.

Также я вижу некоторые сообщения о том, что они разбивают пакет на несколько файлов (например, app.bundle.js и vendors.bundle.js), а другие имеют 1 большой файл. Каков наилучший метод?

Разделение на несколько файлов, безусловно, является наиболее распространенным методом. Это позволяет сохранить код приложения отдельно от ваших зависимостей, что делает отладку менее кошмаром.

Часть конфигурационного файла WebPack, который обрабатывает это может выглядеть примерно так:

// our angular app 
    entry: { 'vendor': './src/vendor.ts', 'main': './src/main.ts' }, 

    // Config for our build files 
    output: { 
    path: '', 
    filename: '[name].bundle.js', 
    sourceMapFilename: '[name].map', 
    chunkFilename: '[id].chunk.js' 
    }, 

вам нужно использовать задачу Глоток за все это делать, или что-то еще полностью?

Если вы используете Webpack, то Gulp не требуется вообще. Я бы рекомендовал просто использовать сценарии NPM. Не цитируйте меня на этом, но я думаю, что Webpack может просто отказаться от проектов Gulp для Angular2.

Также, как я могу минимизировать HTML-шаблоны в приложении angular2?

Для этого у Webpack есть HTML minify plugin.

Вы можете использовать его так:

loaders: [ 
     { 
       test: /\.html$/, 
       name: "mandrillTemplates", 
       loader: 'raw!html-minify' // raw is another loader 
     } 
    ]