JSPM vs WebPack для Angular 2
Недавно я использовал JSPM для моих проектов angular 2 и нашел, что это очень просто и удобно для работы. И когда дело доходит до добавления новых модулей и создания пакета для использования в производстве.
В основном это просто:
jspm install npm:@angular/somepackage
и config.json и system.js автоматически обновляются для меня.
Когда я хочу создать производственный пакет, я просто делаю это:
jspm bundle-sfx app/main app-bundle.min.js --minify
И чтобы использовать его, я просто создаю html, как это:
<body>
<my-app>Loading...</my-app>
<script src="app-bundle.min.js"></script>
</body>
Он загружается и работает быстро. Используется как для малых, так и для больших приложений angular 2.
Настройка разработки также является удовлетворительной - перезагрузка приложения достаточно быстро, и отладка идет хорошо. Также очень хорошо иметь возможность использовать практически любой модуль из репозитория NPM через JSPM.
Когда вы читаете статьи, у меня создается впечатление, что люди переходят на webpack для angular 2 приложений. Я не перешел на webpack сам, потому что я думаю, что моя настройка работает нормально, а webpack кажется намного более сложной.
Тем не менее я обеспокоен тем, что поддержка JSPM будет исчезать, поскольку кажется, что все больше и больше переходят на webpack.
Должен ли я переключиться на веб-пакет из-за этого? Переключение на webpack даст мне некоторые преимущества, которые я не обнаружил?
У меня есть очень простые шаблоны быстрого запуска angular 2, демонстрирующие мою настройку, которые можно найти здесь: https://github.com/fintechneo/angular2-templates
Был бы очень рад получить некоторые мнения о преимуществах перехода на webpack для этой настройки.
ОБНОВЛЕНИЕ 2017-03-26
Поскольку этот вопрос был отправлен, я обнаружил необходимость еще более быстрого времени загрузки для производственных сборок. Несмотря на то, что JSPM (или webpack) создает оптимизированный пакет, он все еще слишком велик и нуждается в создании шаблонов angular2 после загрузки пакета.
Итак, я нашел поваренную книгу компилятора Ahead of the Time (https://angular.io/docs/ts/latest/cookbook/aot-compiler.html) - которая создает небольшие пакеты, которые начинаются в мгновение ока после загрузка.
Для этого потребовалась установка parallell, хотя все модули angular были установлены с использованием npm (не jspm). Вероятно, можно использовать JSPM для этого тоже с некоторыми усилиями, но я еще не изучил его. Как JSPM, так и эта кулинарная книга AoT используют накопительный пакет, поэтому он должен был бы интегрировать шаг компилятора ngc с JSPM, но сложной задачей является получение TypeScript для использования jspm_packages, а не node_modules.
Ссылка выше с настройкой обновляется с помощью AoT и по-прежнему использует JSPM для среды dev.
Ответы
Ответ 1
Этот ответ требует разбивки следующим образом.
SystemJS v JSPM
JSPM - это, по сути, SystemJS с тем преимуществом, что JSPM настраивает для вас ваш systemjs.config.js. Я люблю JSPM, когда он работает (что, к сожалению, не всегда).
Преимущество здесь в том, что JSPM также связывает ваши JS файлы для вас.
JSPM v Webpack
Учитывая, что JSPM фактически использует SystemJS под капотом, этот вопрос по существу должен использоваться с SystemJS или Webpack.
Не снова! Я ответил на это раньше (верхний ответ) здесь.
Каковы различия между SystemJS и Webpack?
Кратким повторением этого содержимого является то, что Webpack не заменяет SystemJS (или JSPM), он просто делает их избыточными.
Однако здесь есть твист, в котором JSPM обеспечивает связывание. Итак, зачем переходить в Webpack?
Преимущество JSPM - простота настройки.
Эта же польза также является ее падением, поскольку простота настройки означает отсутствие опций и отсутствие опций - отсутствие контроля.
Webpack не только связывает файлы JS, но также связывает CSS, HTML и все остальное в одном файле bundle.js, который (после кэширования) делает приложения Webpack молниеносно (но медленно загружается изначально).
Кроме того, JSPM удовлетворяет потребность в связке, но как вы собираетесь пересылать файлы с помощью JSPM? например Если я хочу использовать Stylus вместо CSS, то что будет переводить мои файлы Stylus в CSS? Я собираюсь бросить Gulp в микс (который у меня убит горем, теперь имеет 1/3 загрузки Webpack, но он вел 6 месяцев назад). Или переключиться на Webpack?
Я не поклонник Webpack из-за его плохих документов, но учитывая, что у него такая огромная доля на рынке, я думаю, что мы все скоро будем прыгать на лодке Webpack.
