Приложение Bundle Angular 2, использующее пакеты UMD (не создает пакет поставщика)

В настоящее время я связываю свое приложение Angular 2 с WebPack. Мы по-прежнему развиваем быстрые циклы, поэтому вместо добавления задержек в процесс сборки и загрузки приложений мы хотим включить редко меняющиеся подготовленные пакеты Angular 2 UMD CDN, например:

<script src="https://npmcdn.com/@angular/[email protected]/bundles/core.umd.min.js"></script>
<script src="https://npmcdn.com/@angular/[email protected]/bundles/common.umd.min.js"></script>
<script src="https://npmcdn.com/@angular/[email protected]/bundles/compiler.umd.min.js"></script>
Когда я просто позволяю WebPack делать свое дело, пакет работает нормально, но занимает несколько МБ, потому что он не использует готовые пакеты и не выделяет код Angular 2 «vendor».Когда я используюAngular 2 WebPack РекомендацииНапример:plugins: [ new webpack.optimize.CommonsChunkPlugin("vendor", "vendor.bundle.js") ]Мой пакет приложений небольшой, но я вручную создаю отдельный уникальный пакет объемом 1 МБ, содержащий большую часть среды Angular 2, каждую сборку. Этот файл слегка изменяется при каждой сборке, в зависимости от моего приложения, и не переносится между версиями моих приложений или различными приложениями и не имеет преимущества «CDN». Конечно, я должен включить этот файл для запуска моего приложения.Когда я использую IgnorePlugin для фильтрации@angular|rxjsнапример,plugins: [ new webpack.IgnorePlugin(/\@angular|rxjs/) ], он исключает файлы поставщика, но вставляет жестко запрограммированные исключения / выбрасывает ошибки в начало моего пакета приложений.Когда я используюWebPack externalsнапример,externals: ['@angular/core', ..., Я получилfunction(module, exports) { module.exports = @angular/core; }, вывод в моем комплекте приложений, который, очевидно, не работает. Документация WebPack не так уж и доступна, но я думаю, что я могу либо указатьlibraryTarget или указанная функция разрешения, которая инструктирует WebPack компилировать при загрузке модуля.Когда я полностью отказываюсь от WebPack и использую вместо этого компилятор компилятора TypeScript (согласноэто руководство, который использует пакеты UMD), я получаюSystem.register() звонки, относящиеся к пространствам имен NPM, которые я ожидал, например,System.register("myapp/boot", ['@angular/core', ..., но я все еще работаю над настройкой SystemJS для вызова UMD. Как примечание, этот файл имеет дополнительные 25% размера по сравнению с тем, что генерирует WebPack.Если я использую SystemJS, как в предыдущем пункте, я хочу, чтобы эта компиляция происходила во время сборки или как параллельный процесс, а не как часть сохранения файла. ПохожеSystemJS-строитель (см. связанные вопросыВот а такжеВот) будет ли способ сделать это? Возможно, это также приведет к меньшим размерам файлов, чем встроенный в Typescript «упаковщик».

Как создать пакет приложений, который не зависит от уникально переупакованного пакета Angular 2?

Я сейчас строю против RC3. Мой процесс в настоящее время WebPack, как упоминалось выше, но я бы перешел к другому набору инструментов, если это облегчает.

Проводя дальнейшие исследования, я думаю, что меня ввела в заблуждение терминология WebPack "Loader". Я должен использовать загрузчик модулей, и не похоже, что в WebPack есть тот, который будет работать для этого.

Чтобы назначить пространства имен модуля UMD-пакетов (и подключить их), они не могут быть загружены в теги сценария. Вместо этого они должны быть оценены с учетомthis контекст, чтобы действовать в качестве ссылки на модуль. Это означает, что даже если я хочу, чтобы они все загружались синхронно, мне все равно нужно настроить что-то еще, например SystemJS, чтобы загружать их по проводам, чтобы их контекст контролировался / переносился.

этоУгловой 2-х плункер рядом с тем, что я ищу. Он использует пакеты Angular 2 UMD, но не использует пакет RxJs, хотя это выглядит достаточно легко изменить, если я хочу всю библиотеку RxJs.

Ответы на вопрос(2)

Ваш ответ на вопрос