Від автора: Angular CLI – інструмент командного рядка для створення додатків на Angular. За останній рік він став найголовнішим інструментом серед розробників Angular. CLI автоматизує безліч завдань, покладених на розробника в 2017 році. Починаючи з конфігурації, яка йде за замовчуванням, цей інструмент «випікався» кращих практиках, знайдених спільнотою за довгий час, і з його допомогою можна створювати обслуговується код. CLI являє парочку найпотужніших можливостей Angular, і це простота в освоєнні, швидкий розгін порівняно з самостійною установкою.
Якщо ви ще не користуєтеся перевагами CLI, це легко виправити. Скажімо, у вас встановлені node і npm. З допомогою чотирьох команд нижче ви можете швидко підняти Angular і CLI.
npm install —g @angular/cli
ng new my-angular-project
cd my-angular-project
ng serve
Пробіжимося
Angular CLI сильно змінився за останні пару місяців. Можете подивитися великі замітки про прогрес на сторінці релізу. Однак потрібно подивитися, що сталося з цим інструментом за останні 4 місяці.
1.2 червень 2017
Прапор —minimal
З допомогою прапора minimal розробники можуть генерувати маленькі спрощені стандартні проекти. Згенеровані з цим прапором проекти відрізняються від звичайних:
Инлайновые стилі – стилі зберігаються безпосередньо у файлах компонента
Инлайновые шаблони шаблони зберігаються безпосередньо у файлах компонента
Немає тестів – проект не генерує юніт і комплексні тести
Білди з іменами
При використанні ледачою завантаження в Angular ми будемо генерувати набір файлів, який буде подгружаться роутером Angular тільки при необхідності для запитаного користувачем роута.
При створенні продакшн білду ім’я задається цифрами в послідовності процесу створення.
0.46af283b5453c1d30d30.chunk.js
1.2b2a029972b8935a384a.chunk.js
Тепер при створенні білдів використовуються ім’я модуля. Воно виступає в якості підказки і є частиною процесу створення білду. Ім’я допомагає з дебагом в білдах, які не йдуть в продакшн.
admin.module.chunk.js
home.module.chunk.js
Дедупликация ліцензії та ізоляція
Angular, як і безліч інших сторонніх проектів, часто підключає сотні окремих файлів зі своїми ліцензіями. CLI завжди допомагає розробникам з сумісністю, об’єднуючи ліцензії в процесі побудови білду.
Зараз для зменшення розмірів білду ми отримуємо ці ліцензії в окремий файл 3rdpartylicenses.txt і видаляємо дублюючі ліцензії.
1.3 серпень 2017
Зменшення ваги білду
З кожним релізом ми ретельно працюємо над поліпшенням якості коду, що генерується CLI в продакшн білдах. У цьому релізі ми задіяли останні можливості Webpack 3, в тому числі і підняття видимій області.
Також ми включили бета нового інструменту, над яким ми зараз працюємо. З його допомогою можна видаляти непотрібний код. Інструмент називається build optimizer. Для активації використовуйте наступний прапор:
ng build –prod –build-optimizer
Ми перевірили інструмент на власному сайті angular.io. Розмір продакшн білду скоротився на 52%.
Angular Universal
Серверний рендеринг – відмінний спосіб підвищити сприйняття продуктивності програми. Ваше додаток стане краще працювати з ботами типу Twitter і Facebook, які заходять на ваш сайт, коли користувачі діляться контентом.
Angular Універсальний увійшов в реліз Angular v4 і включав в себе всі необхідні API для візуалізації програми на сервері. Універсальний Support CLI спрощує цей процес, дозволяючи створювати друге CLI додаток з допомогою конфига .angular-cli.json. Цей конфіг обертається навколо основного додатка і дозволяє генерувати білд server.
Початкова підтримка для ранніх бета v5
Angular робить основні релізи приблизно раз в 6 місяців. Команда робить все Open Source, тому в ранній бета-версії в Angular мало функціоналу. Але людям може сподобатися цей інструмент, а команда Angular завжди сподівається на зворотний зв’язок від попередніх тестів.
Ви можете протестувати майбутні релізи Angular і дати свій відгук. Реліз Angular 5.0.0 зажадає останньої версії CLI.
1.4 вересень 2017
Schematics
Schematics – один з головних проектів команди CLI. Schematics дозволяє запускати довільний код для трансформації дерева – це спосіб автоматичного написання коду і генерації файлів. Ці можливості дозволяють створювати свої шаблони для ng new і ng generate під ваш стиль або компанію, будувати поверх надаються шаблонів. Також ви можете генерувати код за формою і відповіді від віддаленого API.
Schematics постійно розвивається, а зовсім скоро почнеться написання документації. Щоб довести придатність і технічну основу Schematics, ми автоматично включили цей инсутрмент в реліз CLI 1.4.
Майбутнє CLI
У команди CLI безліч планів, які повинні зробити життя розробників ще простіше. Ось кілька ідей, які команда сподівається включити в майбутні релізи (але не обіцяє):
Режим Ahead of Time Compilation за замовчуванням – команда Angular старанно намагається зробити компіляцію ще швидше, і як тільки компілятор досягне того рівня продуктивність, який ми спостерігаємо зараз, ми включимо режим AOT за замовчуванням. Це усуне проблеми, коли розробники стикалися з відмінностями в двох режимах.
ng update — Angular регулярно випускає патчі, невеликі і великі поновлення. У CLI може з’явитися можливість інформувати вас про появу оновлень. Команда Angular працює над інструментами для Material і для інших країн з автоматичного оновлення. Інструмент повинен сам буде розбирати зміни, а CLI ідеальне місце для цього.
Підтримка бібліотек – сьогодні CLI може робити оптимізовані UMD для браузера і оптимізовані пакети CommonJS для сервера. Що якщо б CLI вмів робити пакети для інших додатків Angular?
Build Optimizer за замовчуванням — Build Optimizer багатообіцяючий інструмент, з допомогою якого розробники можуть передавати в браузер вкрай маленькі пакети. Як тільки цей інструмент пройде перевірки і буде схвалений співтовариством, ми включимо його за замовчуванням.
Service Worker за замовчуванням – ми віримо в те, що процес створення хороших веб-додатків включає в себе версію програми під Progressive Web App (PWA) з сервіс воркером. Ми віримо, що ці інструменти можна включити за замовчуванням, не руйнуючи очікувань розробників щодо загальних завдань типу видалення або оновлення. Сподіваємося зробити це в майбутньому.
Почнемо
Розробники Angular по всьому світу вибирають CLI, як найлегший спосіб створення додатків на Angular. Спробуйте CLI і ви на новому або існуючому проекті. Пишіть нам, чи допоміг вам наш інструмент, а також, що ви ще хотіли б бачити в ньому!