Angular обновился до версии 5.1

После выхода мажорного релиза Angular 5.0 в прошлом месяце команда объявила о выпуске корректирующего обновления Angular 5.1.0, в котором появилось несколько мелких фич и исправлены некоторые ошибки. Также был выпущен Angular CLI 1.6 и представлена первая стабильная версия Angular Material.

Что нового?

• стабильные версии Angular Material и CDK;
• поддержка Service Worker API в CLI;
• улучшена поддержка Universal и AppShell в CLI;
• доработаны сообщения об ошибках декоратора;
• поддержка TypeScript 2.5.

Полный список функций и исправлений можно посмотреть на страницах Angular, Material, и CLI.

Стабильные версии Angular Material и CDK

Angular Material основан на визуальном языке Material Design от Google. Angular Material предлагает 30 компонентов пользовательского интерфейса для создания приложений. Angular CDK представляет собой набор компонентов для создания собственных элементов, без необходимости решать заново общие задачи. Эти компоненты уже используются в производстве рядом приложений Google, включая Google Analytics Suite, Google Cloud Platform Developer Console, и Google Shopping Express.

Начиная с текущей версии, Angular Material будет придерживаться той же философии SemVer, что и Angular. Основные версии Angular Material и Angular CDK будут выходить одновременно с остальной платформой. Патч-релизы будут выпускаться с недельными интервалами, а второстепенные выпуски станут доступны по мере готовности функций.

Документация и руководство по началу работы доступны на официальном сайте. Также следить за ходом работы команды можно на странице проекта на GitHub.

Поддержка Service Worker в CLI 1.6

В Angular 5.0.0 была включена поддержка Service Worker, адаптированной для Angular-приложений. Angular CLI 1.6 поддерживает приложения, использующие новую функцию. По утверждению команды разработчиков, использование @angular/service-worker может повысить производительность загрузки приложений в браузерах, которые поддерживают данный API.

Подробнее о начале работы c Angular Service Worker можно ознакомиться на сайте документации.

Улучшена поддержка Universal и App Shell в CLI 1.6

С выходом Angular CLI 1.6 доработана возможность внедрения Universal в существующие проекты через Schematics. Также добавлена поддержка App Shell.

Angular Universal

Следующая команда позволяет добавить поддержку Universal в существующее CLI-приложение:

ng generate universal <name>

Это создаст модуль Universal в текущем приложении и автоматически сконфигурирует файл angular-cli.json.

Создать Universal приложение:

ng build --app=<name>

Поддержка App Shell

С добавлением поддержки архитектуры App Shell, появилась возможность создать оболочку приложения, которая создаст статический «первый экран» во время загрузки приложения.

Вначале необходимо импортировать RouterModule в NgModule приложения, а <router-outlet></router-outlet> в шаблон компонента приложения. App Shell использует маршрутизатор для рендера приложения.

Затем запускается команда:

ng generate app-shell [ --universal-app <universal-app-name>] [ --route <route>]

Далее необходимо собрать приложение используя ng build и маршрут из вашего приложения будет автоматически включен в index.html файл.

Доработаны сообщения об ошибках декораторов

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

Например, вызов функции для создания шаблона не поддерживается:

			@Component({
  template: genTemplate()
})
export class MyComponent {}
		

Ранее это вызвало бы следующую ошибку:

			Error encountered resolving symbol values statically. Calling function ‘genTemplate’, function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol MyComponent in components.ts, resolving symbol MyComponent in components.ts
		

Сообщение об ошибке было доработано и теперь поясняет источник и причину проблемы:

			component.ts(9,16): Error during template compile of 'MyComponent'.
  Function calls are not supported in decorators but 'genTemplate' was called.
		

Поддержка TypeScript 2.5

Добавлена поддержка TypeScript 2.5. Этот выпуск TypeScript включает несколько полезных расширенных функций. Обновить TypeScript можно, введя следующую команду:

yarn add typescript@'~2.5.3'or npm install typescript@'~2.5.3'.

Но данное действие не является обязательным, поскольку TypeScript 2.4 продолжает поддерживаться Angular 5.x.x. Поддержку TypeScript 2.6 команда планирует добавить в следующем обновлении.