Aktualisieren Sie Ihre CLI

Jetzt haben viele Frameworks CLI (Command Line Interface) in ihrem Arsenal, und Angular ist keine Ausnahme. Ich bin zum ersten Mal auf CLI-Dienstprogramme gestoßen, als ich EmberJS ausprobiert habe, und dann schien es mir ein sehr praktisches Tool zu sein, das mir viel Zeit gespart hat. Leider sind sofort einsatzbereite CLI-Dienstprogramme nur für einfache Heimprojekte geeignet.

Die Verwendung in großen Produktionsprojekten ohne Fertigstellung mit einer Datei ist nahezu unmöglich. Daher waren wir zu Beginn unseres Projekts aufgrund der Besonderheiten unserer Architektur gezwungen, seine Verwendung aufzugeben. Fast ein Jahr lang habe ich mich regelmäßig mit der Angular CLI in Bezug auf ihre Entwicklung befasst und war verärgert, dass wir sie nicht verwenden konnten, da dies den Einstieg in das Projekt erheblich erleichtern würde. Zu einem bestimmten Zeitpunkt veröffentlichte das Angular-Team jedoch das @ angle-devkit, das eine Reihe von Paketen enthält, die vom Dienstprogramm cli verwendet werden. Dies gab uns die Möglichkeit, die Angular-CLI an unsere Anforderungen anzupassen. Das Repository enthält derzeit etwa ein Dutzend Pakete. In diesem Artikel werden jedoch nur diejenigen berücksichtigt, die sich auf Schaltpläne beziehen.

Schematics CLI , . , ‘ng new’, , ‘ng generate’ - , schematics. Angular , schematics. nrwl.io, , ngrx, redux- . schematics CLI , ? , :

• , Angular CLI. schematics .
• (breaking changes) .
• IDE schematics. , schematics, , , .
• , , , .

, , shematics. , , schematics.

schematics?

Schematics – @angular-devkit, : , , , .

, , , schematics : (). schematics-, , in-memory , , . git – (staging area), , (commit). :

- , schematics (Action List), . , Sink, .

, , schematics . schematics , schematics-cli:

npm install -g @angular-devkit/schematics-cli

schematics Angular CLI, npm . schematics. schematics:

schematics blank --name=sample

, CLI . , :

, npm , src — collection.json, index.ts index_spec.ts.

collection.json schematics . . :

schematics :

, schematics, . :

• schema – json , , .
• factory — , .
• description — , , angular-CLI.
• hidden — CLI- .
• aliases — .
• extends — schematic , . , , .

factory description , .

package.json, , schematics, . , CLI- , .

index.ts, :

, . options, , CLI, schematics . Rule. , , . Tree, . Tree :

• base –
• staging area – , base

, base , staging area. , git. Rule. Rule – , (Tree), . Rule – schematic , , . Rule, , , .

:

. , , . , .. schematics , console.log . Rule , . , , , Observable, . , , npm, package.json.

, :

npm run build
schematics .:sample --name=test

CLI , . , ‘.’.

, . , options, , any. , , , CLI , , . . – schema.json schema.ts. angular-CLI, , . . scheme.ts:

schema.json:

. , :

, . , . quiet , . , - , . . CLI , , . , , . x-promt , . , , .

, :

, , , , schematics.

schematics

schematics , . , , – , , . Tree, Rule, :

create(path: string, content: Buffer | string): void;
delete(path: string): void;
rename(from: string, to: string): void;
overwrite(path: string, content: Buffer | string): void;
read(path: string): Buffer | null;
exists(path: string): boolean;

:

, . , schematics – , , . schematics . , , ‘–dry-run=false’:

schematics .:sample --name=test –dry-run=false

.

, , , , , , , — . , . schematics :

contentTemplate<T>(options: T)
pathTemplate<T>(options: T)
template<T>(options: T)

contentTemplate , pathTemplate , template . ? (Action) . :

• template null, DeleteAction
• , RenameAction
• , OverwriteAction

template – . , , . :

, files . , – . files . , :

__name@dasherize__.service.ts

template , . , ‘_’. , . name. name – @dasherize. , name .

. dasherize – , template . , :

__name@dasherize__.service.ts 

__name@dasherize__.service.spec.ts

, template , . if for:

<% if (a) { %>b<% } %>
<% for (let i = 0; i < value; i++) { %>1<% } %>

, template:

, . , template , apply. Source Rule, .

Source , Tree, base. Source , url, . Rule filter, , . spec , noop, Tree, spec . template, , , , strings, , dasherize classify. angular, . move, .

apply Source , . – chain, mergeWith, branchAndMerge. chain Rule Rule, rule. mergeWith Tree , apply. , rebase git-. . branchAndMerge Tree . , dry-run=false, – , .

schematics , . , , , . API , schematics – externalSchematic schematic. , – .

. , .

, , , component Angular. , . Angular . :

, externalSchematic, Angular. Angular, , schematics . Angular, staging area ‘ts’ . kind ‘c’.

, , Invalid source: undefined. , angular-CLI. , .

CLI

schematics Angular CLI, :

ng new my-project

:

npm link $PATH_TO_SCHEMATIC_PROJECT

schematics , , , npm . , CLI:

, , , , . , .

, , . , , , . , ?

, . , , typescript json , , , ast . , ast typescript, Angular. Angular schematics CLI, . , , , . , . :

• ,
• providers

schematics Angular:

findModuleFromOptions – Angular, .

buildRelativePath – .

addProviderToModule – providers . Angular addExportToModule, addImportToModule, addDeclarationToModule, addBootstrapToModule, etc.

, . , , ast :

:

, buildRelativePath addProviderToModule . addProviderToModule , InsertChange. API schematics – beginUpdate, insertLeft commitUpdate. , , .

, , :

, Angular, , , .

, schematics – , . , , Angular , . , @angular-devkit.

, github — https://github.com/KyKyPy3/schematics.

: KyKyPy3uK