Який найкращий спосіб видалити компонент за допомогою CLI

Я спробував використовувати "ng знищити компонент foo", і це говорить мені "Команда знищення не підтримується Angular-CLI"

Як ми правильно видаляємо компоненти за допомогою Angular CLI?

destroyабо щось подібне може прийти до CLI, але це не є основним фокусом на даний момент. Тому вам потрібно буде це зробити вручну.

Видаліть каталог компонентів (припустимо, що ви не використовували --flat), а потім видаліть його з того, NgModuleу якому він оголошений.

Якщо ви не впевнені, що робити, пропоную вам "чистий" додаток, який не означає поточних gitзмін. Потім генеруйте компонент і подивіться, що зміниться в репо, щоб ви могли звідти відслідкувати, що вам потрібно буде зробити, щоб видалити компонент.

Оновлення

Якщо ви просто експериментуєте над тим, що ви хочете створити, ви можете використовувати --dry-runпрапор, щоб не створювати жодних файлів на диску, просто перегляньте оновлений список файлів.

1. Видаліть папку, що містить цей компонент.
2. У app.module.ts видаліть оператор імпорту цього компонента та видаліть його ім'я з розділу декларації @NgModule
3. Видаліть рядок із заявою про експорт цього компонента з index.ts.

Оскільки він ще не підтримується за допомогою кутового CLI

тож ось можливий спосіб, перед цим, будь ласка, спостерігайте, що відбувається при створенні компонента / послуги за допомогою CLI (наприклад ng g c demoComponent).

1. Він створює окрему папку з назвою demoComponent( ng g c demoComponent).
2. Він генерує HTML,CSS,tsі specфайл, присвячений demoComponent.
3. Крім того, він додає залежність всередині файла app.module.ts, щоб додати цей компонент до вашого проекту.

тому робіть це у зворотному порядку

1. Видалити залежність від app.module.ts
2. Видаліть папку компонентів.

при усуненні залежності потрібно зробити дві речі.

1. Видаліть посилання на рядок імпорту з файлу app.module.ts.
2. Видаліть декларацію компонента з масиву декларацій @NgModule в app.module.ts.

Використовуючи Visual Studio Code, видаліть папку компонентів і побачте в Провіднику проектів (зліва) файли кольорового кольору у червоному кольорі, що означає, що на файли впливають помилки. Відкрийте кожен файл і видаліть код, який використовує компонент.

В даний час Angular CLI не підтримує можливість видалення компонента, це потрібно зробити вручну.

1. Видаліть посилання імпорту для кожного компонента з app.module
2. Видаліть папки компонентів.
3. Також потрібно видалити декларацію компонента з масиву декларацій @NgModule у файлі app.module.ts

Я написав сценарій bash, який повинен автоматизувати процес, написаний Яковим Фаїном нижче. Це можна назвати як ./removeComponent myComponentName Це було протестовано лише з кутовим 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 поки що НЕ . Але це можна зробити вручну, видаливши папку компонентів та всі посилання.

Це не підтримується Angular CLI, і вони не в змозі включити його незабаром.

Ось посилання на фактично створений випуск - https://github.com/angular/angular-cli/isissue/1776

І скріншот рішення чиновників -