Пользовательский конструктор Angular CLI

Обновлять:

Для Angular 8+ прочтите это Статья об AngularInDepth.

Для Angular 6 и 7:

Полную версию статьи можно найти здесь.

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

Реализация:

1. Создайте каталог для ваших пользовательских построителей (например, custom-builders) в корне вашего проекта (или, альтернативно, установите его как локальный модуль npm)
2. Внутри каталога создайте файл с именем builders.json, index.ts и package.json, содержащий builders запись, указывающую на builders. json
3. Внутри custom-builders создайте каталог для строителя, который вы хотите реализовать (скажем, custom-builders / my-cool-builder
4. Добавьте index.ts, schema.json и schema.d.ts в каталог my-cool-builder.
5. Заполните schema.json схемой параметров вашего построителя. См. Пример здесь .
6. Определите свой schema.d.ts в соответствии с заданным вами schema.json. См. Пример здесь.

7. Внедрите свой конструктор в my-cool-builder / index.ts. Строитель должен реализовать следующий интерфейс:

   export interface Builder<OptionsT> {
     run(builderConfig: BuilderConfiguration<Partial<OptionsT>>):  Observable<BuildEvent>;
   }
   

   Пока BuildEvent это:

   export interface BuildEvent {
     success: boolean;
   }
   

   BuilderConfiguration это:

   export interface BuilderConfiguration<OptionsT = {}> {
     root: Path;
     sourceRoot?: Path;
     projectType: string;
     builder: string;
     options: OptionsT;
   }
   

   И OptionsT - это интерфейс, который вы определили для своих параметров построителя в schema.d.ts

   Вы можете использовать _8 _ цель архитектора в качестве справки.

8. После реализации добавьте свой конструктор в builders.json:

   {
     "$schema": "@angular-devkit/architect/src/builders-schema.json",
     "builders": {
       "cool-builder": {
         "class": "./my-cool-builder",
         "schema": "./my-cool-builder/schema.json",
         "description": "My cool builder that builds things up"
       }
     }
   }
   

Использование:

В вашем angular.json:

    "architect": {
        ...
        "build": {
                  "builder": "./custom-builders:cool-builder"
                  "options": {
                         your options here
                  }

Пример

Полный пример можно найти в этой библиотеке: https://github.com/meltedspark/angular-builders

Для тех, кто использует Angular 8 и выше, теперь официально поддерживается и документирован API Builder: https://angular.io/guide/cli-builder

В нем много изменений по сравнению с предыдущей версией, поэтому переход с Angular 7 на 8 может усложниться, если вы используете недокументированный API Architect.

Вот хорошая статья для начала: https://blog.angular.io/introduction-cli-builders-d012d4489f1b

Я не тестировал и не совсем уверен, но эта концепция может быть решением.

architect.build.builder использует некоторые схемы Angular для выполнения процесса сборки. Вы можете создать свою собственную схему, которая использует / наследует обычные схемы сборки с дополнительной логикой, которую вы хотите реализовать.