web-dev-qa-db-ja.com

angle-cliカスタム回路図/コレクション

angular cliのカスタム回路図を作成しようとしています。これまでのところ、「コレクション」をコンパイルする必要があることがわかりました。cliはTypeScriptを読み取れません。つまり、クローンhttps://github.com/angular/devkit/tree/master/packages/schematics/angular必要なものを変更して公開するnpmでそれを意味します 全体https://github.com/angular/devkitのクローンを作成し、そのnpm run buildを使用する必要がありますコンパイルされた回路図を作成するにはtscを介して実行 する必要があります。次に、それらのコンパイル済みファイルをnpmに公開し、たとえばnpmを使用してグローバルにインストールできます。

npm i -g @thescrollbar/schematics

そうすれば、ng new --collection=@thescrollbar/schematics my-appを実行できるはずでしたが、驚くべきことに、それは機能せず、tree.branch is not a functionをスローしていました。

ただし、このグローバルにインストールされたパッケージをcliのモジュールにコピーすると

/usr/local/bin/node_modules/@thescrollbar/schematics-> /usr/local/bin/node_modules/@angular/cli/node_modules/@thescrollbar/schematics

動作を開始し、回路図に基づいた新しいアプリを作成できます。

新しい問題については、次の方法で新しいコンポーネントを生成しようとすると、回避策がありません。

ng g c --collection=@thescrollbar/schematics logo

コレクションの代わりに@schematics/angularテンプレートを使用して作成しますが、意図的に作成する場合は

ng g shat --collection=@thescrollbar/schematics logo

それは言う

コレクション「@thescrollbar/schematics」に回路図「shat」が見つかりません。

これは、実際に私のコレクションを使用していることを明確に示していると思いますか？

カスタムコレクションを機能させることができた人はいますか？グローバルに、そしてコンポーネント/モジュールを生成するために？

angularangular-cliangular-schematics
10
fxck

/ usr/local/bin/node_modules/@ thescrollbar/schematics->/usr/local/bin/node_modules/@ angular/cli/node_modules/@ thescrollbar/schematics

はい、これは現在の実装の問題です。これは、コレクション名に対して（盲目的に）require.resolveを呼び出すためです。これは、CLIである現在のモジュールからのみ解決されます。次のリストを使用して解決される、今週リリースされる予定の修正（ PR 16 ）があります。

  • それはprocess.cwd（）に関連するノードパッケージですか？
  • それはツール（あなたの場合はCLI）に関連するノードパッケージですか？
  • グローバルにインストールされたノードパッケージですか？

欠落しているフォールバックが2つ欠落していることに気付くかもしれません。それはあなたの回路図に関連するパッケージですか、それはあなたのプロジェクトに関連するパッケージですか？それは来ています、それは実装するのが少し複雑です。いずれにせよ、回路図をグローバルにインストールすることができ、それは問題なく機能します。

ng g c --collection = @ thescrollbar/schematicsロゴ

コレクションの代わりに@schematics/angularテンプレートを使用して作成します

これは既知の問題であり、CLIで修正するPRがあります。これも予定されている修正です。

回路図をお試しいただきありがとうございます。これは長い間プロジェクトであり、まだ多くの小さなEdgeケースを修正しています。また、すぐに、より優れたドキュメントとチュートリアル（回路図の回路図を含む）を用意する予定です。ほぼ進行中の作業ですので、しばらくお待ちいただきますようお願いいたします。

Angular DevKitリポジトリ（ https://github.com/angular/devkit ）で問題やバグを報告できます。

10
Hans

Cli 1.4.1の簡単な修正は、node_modules/@ angular/cli/messages/new.jsを編集し、run：function（commandOptions、rawArgs）で行を変更することです。

commandOptions.collectionName = this.getCollectionName(rawArgs);

に

commandOptions.collectionName = commandOptions.collection || this.getCollectionName(rawArgs);

0
Vlisisids Akis