有道云
当创建 Angular 库时，你可以为同时为它打包进一组原理图，并把它与 Angular CLI 集成在一起。借助原理图，用户可以用 ng add 来安装你这个库的初始版本，可以用 ng generate 来创建你在库中定义的一些工件，可以用 ng update 来调整他们的项目，以支持你在库的新版本中引入的重大变更。
下载库的原理图项目以获取一个已完成的例子。
开始
projects/my-lib/schematics/collection.json (Schematics Collection)
| 属性 |
描述 |
| $schema |
路径是相对于 Angular Devkit 集合模式定义的。 |
| schematics |
对象描述了该集合中的命名原理图 |
projects/my-lib/tsconfig.schematics.json (TypeScript Config)
| 属性 |
描述 |
| rootDir |
指出在你的 schematics/ 文件夹中包含要编译的输入文件。 |
| outDir |
映射到了库的输出目录下。默认情况下，这是工作空间根目录下的 dist/my-lib 文件夹。 |
projects/my-lib/package.json (Build Scripts)
| 属性 |
描述 |
| build |
指出在你的 schematics/ 文件夹中包含要编译的输入文件。 |
| copy |
* 语句将已编译的原理图文件复制到库的输出目录下的正确位置，以保持目录的结构。 |
| postbuild |
脚本会在 build 脚本完成后复制原理图文件。 |
projects/my-lib/schematics/my-service/schema.json (Schematic JSON Schema)
| 属性 |
描述 |
| id |
这个模式定义在集合中的唯一 id。 |
| title |
* 一个人类可读的模式描述。 |
| type |
由这些属性提供的类型描述符。 |
| properties |
一个定义该原理图可用选项的对象 |
projects/my-lib/schematics/my-service/schema.ts (Schematic Interface)
name
| 你要为创建的这个服务指定的名称。
path | 覆盖为原理图提供的路径。默认情况下，路径是基于当前工作目录的。
project | 提供一个具体项目来运行原理图。在原理图中，如果用户没有给出该选项，你可以提供一个默认值。
projects/my-lib/schematics/my-service/files/__name@dasherize__.service.ts.template (Schematic Template)
classify
| 接受一个值，并返回标题格式（title case）的值。比如，如果提供的名字是 my service，它就会返回 MyService。。
dasherize | 接受一个值，并以中线分隔并小写的形式返回值。比如，如果提供的名字是 MyService，它就会返回 “my-service” 的形式。
name | 工厂函数提供的一个属性。它与你在模式中定义的 name 是一样的。
projects/my-lib/schematics/my-service/index.ts (Template transform)
apply()
| 方法会把多个规则应用到源码中，并返回转换后的源代码。它需要两个参数，一个源代码和一个规则数组。
url() | 会从文件系统中相对于原理图的路径下读取源文件。
applyTemplates() | 接收一个参数，它的方法和属性可用在原理图模板和原理图文件名上。它返回一条 Rule。你可以在这里定义 classify() 和 dasherize() 方法，以及 name 属性。
运行你的库原理图
在构建库和原理图之后，你就可以安装一个原理图集合来运行你的项目了。下面的步骤介绍了如何使用上面创建的原理图来生成服务。
构建你的库和原理图
在工作区的根目录下，运行库的 ng build 命令。
$ content_copy
$ ng build my-lib
然后，进入库目录，构建原理图
$ content_copy
$ cd projects/my-lib
$ npm run build
链接这个库
这些库和原理图都已打包好了，就放在你工作区根目录下的 dist/my-lib 文件夹中。要运行这个原理图，你需要把这个库链接到 node_modules 文件夹中。在工作空间的根目录下，运行 npm link 命令，并把你的可分发库的路径作为参数。
$ content_copy
$ npm link dist/my-lib
运行原理图
现在你的库已经安装完毕，可以使用 ng generate 命令来运行原理图了。
$ content_copy
$ ng generate my-lib:my-service --name my-data
在控制台中，你会看到原理图已经运行过了，my-data.service.ts 文件被创建在了你的 app 文件夹中。
CREATE src/app/my-data.service.ts (208 bytes)
Api
@angular-devkit/schematics
base
source()
| `(tree: Tree): Source` | 返回tree作为其单个值的source
empty() | `(): Source` | 返回空的tree作为source
chain() | `(rules: Rule[]): Rule` | 将多个规则链接到一个规则中。
apply() | `(source: Source, rules: Rule[]): Source`|将多个规则应用于source，然后返回转换后的source。
mergeWith() | `(source: Source, strategy?: MergeStrategy): Rule` | 合并输入的tree与传入的soure
noop() | `(): Rule` |
filter() | `(predicate: FilePredicate
): Rule;` |
asSource() | `(rule: Rule): Source`|
branchAndMerge() |`(rule: Rule, strategy?: MergeStrategy): Rule`|
when() | `(predicate: FilePredicate, operator: FileOperator): FileOperator;`|
partitionApplyMerge() | `(predicate: FilePredicate, ruleYes: Rule, ruleNo?: Rule): Rule;`
forEach() | `(operator: FileOperator): Rule;`
composeFileOperators() | `(operators: FileOperator[]): FileOperator;`
applyToSubtree() | `(path: string, rules: Rule[]): Rule`
call
callSource()
| `(source: Source, context: SchematicContext): Observable`
callRule() | `(rule: Rule, input: Tree | Observable, context: SchematicContext): Observable;`
move
| 方法 |
参数 |
描述 |
| move() |
(from: string, to?: string): Rule |
|
random
| 方法 |
参数 |
描述 |
| random |
(options: RandomOptions): Source |
|
rename
| 方法 |
参数 |
描述 |
| rename() |
(match: FilePredicate<boolean>, to: FilePredicate<string>): Rule |
|
schematic
externalSchematic() |`(collectionName: string, schematicName: string, options: OptionT, executionOptions?: Partial): Rule;` |
schematic() | `(schematicName: string, options: OptionT, executionOptions?: Partial): Rule`
Template
applyContentTemplate()
|`(options: T): FileOperator`|
contentTemplate() |`(options: T): Rule`
applyPathTemplate() |`(data: T, options?: PathTemplateOptions): FileOperator`
pathTemplate() | `(options: T): Rule`
renameTemplateFiles() |`(): Rule` |
template() | `(options: T): Rule`
applyTemplates() | `(options: T): Rule`
url
| 方法 |
参数 |
描述 |
| url() |
(urlString: string): Source |
|
@angular-devkit/core
strings
| 方法 |
参数 |
描述 |
| decamelize() |
(str: string): string |
|
| dasherize() |
(str: string): string |
|
| camelize() |
(str: string): string |
|
| classify() |
(str: string): string |
|
| underscore() |
(str: string): string |
|
| capitalize() |
(str: string): string |
|
| levenshtein() |
(str: string): string |
|
template
| 方法 |
参数 |
描述 |
| templateParser() |
(urlString: string): Source |
|
| template() |
(content: string, options?: TemplateOptions): (input: T) => string; |
|
literals
| 方法 |
参数 |
描述 |
| oneLine() |
(strings: TemplateStringsArray, ...values: any[]): string |
|
| indentBy() |
(indentations: number): TemplateTag |
|
| stripIndent() |
(strings: TemplateStringsArray, ...values: any[]): string |
|
| stripIndents() |
strings: TemplateStringsArray, ...values: any[]): string |
|
| trimNewlines() |
strings: TemplateStringsArray, ...values: any[]): string |
|
lang
| 方法 |
参数 |
描述 |
| isPromise() |
(obj: any): obj is Promise<any> |
|
| isObservable() |
`(obj: any |
Observable): obj is Observable` |
array
| 方法 |
参数 |
描述 |
| clean() |
`(array: Array<T |
undefined>): Array` |
@angular-devkit/schematics/tasks
| 类 |
参数 |
描述 |
| NodePackageInstallTask |
|
node 安装支持 |
@schematics/angular/utility/ast-utils
insertImport()
|`(source: ts.SourceFile, fileToEdit: string, symbolName: string, fileName: string, isDefault?: boolean): Change;`
findNodes() |`(node: ts.Node, kind: ts.SyntaxKind, max?: number, recursive?: boolean): ts.Node[];`
getSourceNodes() | `(sourceFile: ts.SourceFile): ts.Node[]`
findNode() |`(node: ts.Node, kind: ts.SyntaxKind, text: string): ts.Node | null`
insertAfterLastOccurrence() | `(nodes: ts.Node[], toInsert: string, file: string, fallbackPos: number, syntaxKind?: ts.SyntaxKind): Change`
getContentOfKeyLiteral() | `(_source: ts.SourceFile, node: ts.Node): string | null`
getDecoratorMetadata() | `(source: ts.SourceFile, identifier: string, module: string): ts.Node[]`
getFirstNgModuleName() | `(source: ts.SourceFile): string | undefined`
getMetadataField() | `(node: ts.ObjectLiteralExpression, metadataField: string): ts.ObjectLiteralElement[]`
addSymbolToNgModuleMetadata() | `(source: ts.SourceFile, ngModulePath: string, metadataField: string, symbolName: string, importPath?: string | null): Change[]`
addDeclarationToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
addImportToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
addProviderToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
addExportToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
addBootstrapToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
addEntryComponentToModule() | `(source: ts.SourceFile, modulePath: string, classifiedName: string, importPath: string): Change[]`
isImported() | `(source: ts.SourceFile, classifiedName: string, importPath: string): boolean`
getEnvironmentExportName() | `(source: ts.SourceFile): string | null`
getRouterModuleDeclaration() | `(source: ts.SourceFile): ts.Expression | undefined`
addRouteDeclarationToModule() | `(source: ts.SourceFile, fileToAdd: string, routeLiteral: string): Change`
workspace
updateWorkspace()
|`(updater: (workspace: workspaces.WorkspaceDefinition) => void | PromiseLike): Rule`
updateWorkspace() | `(workspace: workspaces.WorkspaceDefinition): Rule`
getWorkspace() | `(tree: Tree, path?: string): Promise`
buildDefaultPath() | `(project: workspaces.ProjectDefinition): string`
createDefaultPath() | `(tree: Tree, projectName: string): Promise`
find-module
findModuleFromOptions() | `(host: Tree, options: ModuleOptions): Path | undefined`
findModule() | `(host: Tree, generateDir: string, moduleExt?: string, routingModuleExt?: string): Path`
buildRelativePath() | `(from: string, to: string): string`
lint-fix
| 方法 |
参数 |
描述 |
| applyLintFix() |
(path?: string): Rule |
|
ng-ast-utils
| 方法 |
参数 |
描述 |
| findBootstrapModuleCall() |
`((host: Tree, mainPath: string): ts.CallExpression |
null` |
| findBootstrapModulePath() |
(host: Tree, mainPath: string): string |
|
| getAppModulePath() |
(host: Tree, mainPath: string): string |
|
parse-name
| 方法 |
参数 |
描述 |
| parseName() |
(path: string, name: string): Location |
|
paths
| 方法 |
参数 |
描述 |
| relativePathToWorkspaceRoot() |
`(projectRoot: string |
undefined): string` |
project
buildDefaultPath() | `(project: WorkspaceProject): string;`
getProject() | `(workspaceOrHost: WorkspaceSchema | Tree, projectName: string): WorkspaceProject;`
isWorkspaceSchema() | `(workspace: any): workspace is WorkspaceSchema;`
isWorkspaceProject() | `(project: any): project is WorkspaceProject;`
validation
| 方法 |
参数 |
描述 |
| validateName() |
(name: string): void |
|
| validateHtmlSelector() |
(selector: string): void |
|
| validateProjectName() |
(projectName: string): void |
|
浙公网安备 33010602011771号