CLIでコンポーネントを削除する最良の方法は何ですか

「ng destroy component foo」を使用してみましたが、「destroyコマンドはAngular-CLIでサポートされていません」と表示されます

Angular CLIでコンポーネントを適切に削除するにはどうすればよいですか？

destroyまたは同様のものがCLIに登場する可能性がありますが、現時点では主な焦点ではありません。したがって、これを手動で行う必要があります。

コンポーネントディレクトリを削除し（使用しなかった場合--flat）、NgModule宣言されているから削除します。

どうすればよいかわからない場合は、現在のgit変更がないことを意味する「クリーン」なアプリをお勧めします。次に、コンポーネントを生成し、リポジトリで変更された内容を確認します。これにより、コンポーネントを削除するために必要なことをそこからバックトラックできます。

更新

生成したいものについて実験しているだけの場合は、--dry-runフラグを使用してディスク上にファイルを作成せずに、更新されたファイルリストを確認できます。

1. このコンポーネントを含むフォルダを削除します。
2. app.module.tsで、このコンポーネントのインポート文を削除し、@ NgModuleの宣言セクションからその名前を削除します
3. このコンポーネントのexportステートメントを含む行をindex.tsから削除します。

Angular CLIの使用はまだサポートされていないため

そのため、ここでは可能な方法です。その前に、CLI（例ng g c demoComponent）を使用してコンポーネント/サービスを作成するとどうなるかを確認してください。

1. demoComponent（ng g c demoComponent）という名前の別のフォルダーが作成されます。
2. これはHTML,CSS,ts、specdemoComponent専用のファイルを生成します。
3. また、app.module.tsファイル内に依存関係を追加して、そのコンポーネントをプロジェクトに追加します。

逆の順序で行います

1. 依存関係を削除 app.module.ts
2. そのコンポーネントフォルダを削除します。

依存関係を削除するときは、2つのことを行う必要があります。

1. app.module.tsファイルからインポート行参照を削除します。
2. app.module.tsの@NgModule宣言配列からコンポーネント宣言を削除します。

Visual Studio Codeを使用して、コンポーネントフォルダーを削除し、プロジェクトエクスプローラー（左側）で赤に着色されたファイルを確認します。これは、ファイルが影響を受け、エラーが発生したことを意味します。各ファイルを開き、コンポーネントを使用するコードを削除します。

現在、Angular CLIはコンポーネントを削除するオプションをサポートしていません。手動で削除する必要があります。

1. app.moduleからすべてのコンポーネントのインポート参照を削除します
2. コンポーネントフォルダを削除します。
3. また、app.module.tsファイルの@NgModule宣言配列からコンポーネント宣言を削除する必要があります

以下のYakov Fainによって書かれたプロセスを自動化するbashスクリプトを書きました。./removeComponent myComponentNameのように呼び出すことができます。これはAngular 6でのみテストされています

#!/bin/bash
if [ "$#" -ne 1 ]; then
    echo "Input a component to delete"
    exit 1
fi

# finds folder with component name and deletes
find . -type d -name $1 | xargs rm -rf

# removes lines referencing the component from app.module.ts
grep -v $1 app.module.ts > temp
mv temp app.module.ts

componentName=$1
componentName+="Component"

grep -v -i $componentName app.module.ts > temp
mv temp app.module.ts

それが最善の方法かどうかはわかりませんが、うまくいきました。

• まず、コンポーネントフォルダを削除しました。
• 次に、削除したいコンポーネントに関連するインポートと宣言のapp.module.ts、app.component.tsおよびapp.component.htmlをクリアしました。
• 同様に、main.tsをクリアしました。

アプリを保存して更新したところ、うまくいきました。

Angular 2+の回答

from imports and declaration arrayapp.modules.tsのコンポーネントを削除します 。

次に、その参照が他のモジュールに追加されていることを確認します。追加されている場合は削除して

最後delete that component Manuallyにアプリから、あなたは完了です。

または、逆の順序で行うこともできます。

app.module.tsから：

• 特定のコンポーネントのインポート行を消去します。
• @NgModuleからその宣言を消去します。

その後、削除するコンポーネントとその付属ファイル（フォルダの削除.component.ts、.component.html、.component.cssおよび.component.spec.ts）を。

できました。

-

main.tsから消去することについて人々が言っ​​ているのを読みました。AppModuleはすでにインポートされているため、そもそもそこからインポートする必要はありませんでした。AppModuleは、作成したすべてのコンポーネントをインポートするものです。

スペックファイルに誤りがあるAngular 6ディレクティブを削除する必要がありました。問題のファイルを削除し、そのファイルへの参照をすべて削除してアプリを再構築した後でも、TSは同じエラーを報告していました。私のために働いたのはVisual Studioを再起動することでした-これはエラーと古い不要なディレクティブのすべてのトレースをクリアしました。

まず、コンポーネントフォルダーを削除します。コンポーネントフォルダーを削除してから、「ts」ファイルに作成したエントリーを削除します。

CLIでコマンドを探している場合、今のところansはNOです。ただし、コンポーネントフォルダとすべての参照を削除することにより、手動で行うことができます。

これはAngular CLIではサポートされておらず、すぐにそれを含める気分ではありません。

ここに実際に作成された問題へのリンクがあります-https://github.com/angular/angular-cli/issues/1776

そして、当局からの解決策のスクリーンショット-