Начало перевода «legacy» Angular JS проекта на Angular 1.5 Components / ES6 и TypeScript

[Alex_Crack]

и после некоторого количества прочитанных мануалов по различным смежным темам (включая миграцию 1.3 -> 1.4, 1.4 -> 1.5, 1.x -> 2)

Все же, интересно было бы узнать, почему не решились на переход -> 2.x? А фактически попробовали строить angular2-style для версии 1.5.
Вон ребята из Wrike уже используют в продакшене.

[Gugic]

Потому что у них «30+ фронтенд разработчиков» и у них, судя по тому, что я увидел в статье, совсем нет проблем со взять и переписать все по новой («Всё начиналось с Dojo, потом Ext.js. Мы писали на Polymer 0.5, и, когда он стал deprecated (с выходом версии 1.0), перед нами встал вопрос — что же выбрать?» ©). Этот вариант слабо совместим с требованиями (нашего) бизнеса.

А у нас всего два фронтенд-девелопера, при этом поток запрашиваемых и реализуемых фич не остановить.

В этом решении я аккуратно обновил версию основной библиотеки, починил все, что вылезло при обновлении, убрал какие-то deprecated вещи в небольшом количестве, настроил обвязку и в «legacy» части проекта в общем ничего более не менял, она как работала, так и работает. А весь новый функционал уже разрабатывается в приближенном к angular 2 стиле.

Есть еще изощренные варианты с параллельным существованием двух версий angular в проекте, но наш клиентский код итак уже распух сверх всяких мер.

Angular 1.5 — это хороший шаг для начала затяжной миграции. Будут следующие релизы, которые добавят еще больше совместимости между версиями. Функционал потихоньку переписывается согласно рекомендациям из upgrade гайда и я тешу себя надеждой что в каком-то будущем мы осуществим переход.

[indestructable]

А в чем преимущество 2.0? Вторая версия это же, по сути, не обновление, а новый продукт.

[indestructable]

Отвечу сам себе: один из немногих явных плюсов — это нормальная работа с модульностью. В Ангуляр 2 нужно явно указывать компоненты/директивы, используемые в шаблоне, а в первом их нужно регистрировать в модуле, что проигрывает по явности и наглядности зависимости. (Однако, все еще нужно помнить, какой селектор использует компонент).

[wips]

Подскажите, плз, какой модуль/лоадер парсит/транспайлит аннотацию @Component?

@Component({ ... })
export default class StaticInfoComponent { ... }

И правильно ли я понимаю, что команда Angular не предлагает использовать такие аннотации для 1.5.* проектов? Это такой себе v2-like стайл?

[Gugic]

Это typescript decorators.

Правильно понимаете, но он не просто так сложился, так получилось и удобнее и чище. Начинал я с отдельного класса для компонент, имплементирующего angular.IComponentOptions, в который надо было импортировать отдельный «component view controller»

[wips]

Понятно, спасибо. То, что это ts-декораторы я понял. Просто я предполагал, что это не самописный декоратор, а какой-то набор готовых декораторов из npm эмулирующий Angular2 аннотации/декораторы.

[Gugic]

Мой декоратор был полностью приведен в середине статьи. А так-то есть из чего выбрать, просто я пока до них не добрался.

[Arta]

Учитывая переход на TypeScript лучшим вариантом имхо будет вот эта небольшая либа — ng-metadata. Она добавляет кучку декораторов и интерфейсов, совпадающих с ng2, и позволит избавиться от кучи проблем ng1-typescript, даст код практически целиком совпадающий по написанию с ng2 и позволит в дальнейшем очень просто на него перейти.
Текущий проект уже был на ng1 1.5, но при разрастании оказалось что поддерживать чистый js в ng1 окружении очень тяжело, наметился постепенный переход на TypeScript. С ng-metadata код тех же компонентов/директив/сервисов стал приятней чем был на ng1 что без typescript, что с ним.
Либа актуально обновляется, в скором времени введут поддержку @NgModule() из RC5 что позволит перевести на это и код инициализации всех частей приложения и максимально приблизит к ng2.

[Valery4]

Спасибо мил человек, а то ng-forward совсем зачах. Я на нём делал демо проект год назад. А сейчас для продакшена не стал, там больше чем пол года новых коммитов не было.