Czy istnieje sposób na usunięcie niewykorzystanych importów i deklaracji z Angular 2+?


155

Zostałem przydzielony do zabrania trochę pomieszanego kodu od innych programistów, którzy niedawno opuścili firmę.

Z ciekawości pytam, czy jest jakaś wtyczka Visual Studio Code lub inne środki, które pomogłyby nam w szybkim i efektywnym uporządkowaniu i zorganizowaniu importu i referencji?

Na przykład może być setek takich importów

import { AutoCompleteModule,InputSwitchModule } from 'primeng/primeng';
import { ListboxModule } from 'primeng/primeng';

można przekształcić w podobny sposób

import { AutoCompleteModule,
         InputSwitchModule,
         ListboxModule  } from 'primeng/primeng';

Lub inne funkcje, takie jak automatyczne usuwanie tych nieużywanych importów i deklaracji z modułu app.module lub ze wszystkich komponentów w całym projekcie?

Dzięki za wszelkie uwagi!


Ja też się zastanawiam, czy nieistotne importy komponentów są szczególnie obciążeniem dla wydajności.
Marcidius

8
stackoverflow.com/a/49697144/3914072 vscode 1.22 Shift + Alt + O - działa dla mnie!
Rajab Shakirov

Można to zrobić również z wiersza poleceń (lub git hook): npmjs.com/package/organize-imports-cli
thorn ̈

Odpowiedzi:


213

Edytuj (jak sugerowano w komentarzach i innych osobach), Visual Studio Code ewoluował i udostępnia tę funkcję wbudowaną w polecenie „Organizuj importowanie”, z następującymi domyślnymi skrótami klawiaturowymi :

option+ Shift+ Odla Maca

Alt + Shift + Odla Windows


Oryginalna odpowiedź:

Mam nadzieję, że to rozszerzenie kodu Visual Studio wystarczy dla Ciebie: https://marketplace.visualstudio.com/items?itemName=rbbit.typescript-hero

Zapewnia następujące funkcje:

  • Dodaj importy projektu lub bibliotek do bieżącego pliku
  • Dodaj import dla bieżącej nazwy pod kursorem
  • Dodaj wszystkie brakujące importy pliku jednym poleceniem
  • Intellisense, która sugeruje symbole i automatycznie dodaje potrzebną importowaną „funkcję żarówki”, która naprawia napisany przez Ciebie kod
  • Sortuj i organizuj import (sortuj i usuwaj nieużywane )
  • Widok konspektu kodu otwartego dokumentu TS / TSX
  • Wszystkie fajne rzeczy także dla JavaScript! (etap eksperymentalny, dokładniejszy opis poniżej).

W przypadku komputerów Mac: control+ option+o

Dla Win: Ctrl+ Alt+o


1
Dzięki za włączenie mnie do tego dodatku, działa! Aż do momentu zainstalowania go, miałem zainstalowane rozszerzenie Auto-Import, aby zająć się tym małym elementem funkcjonalności (automatyczne importowanie). Ale po zainstalowaniu TypeScript Hero ... wow, robi wszystko, czego potrzebuję, w tym sortowanie zależności w kolejności alfabetycznej w samych instrukcjach importu, usuwanie importu, które nie są używane w klasach komponentów itp.
Marcidius

2
W 2018 opiekun projektu TS Hero zapowiedział , że zaprzestanie rozszerzenia, ponieważ stało się ono przestarzałe po wdrożeniu głównych funkcji bezpośrednio w VS Code (zobacz inne komentarze).
mattarau

2
Jakikolwiek sposób zadzwonić Alt+Shift+Obez zmiany kolejności importu?
XCS

1
Alt + Shift + O także dla Linuksa
manuman94

157

Od wersji 1.22 programu Visual Studio Code jest to bezpłatne i nie wymaga rozszerzenia.

Shift+ Alt+O zaopiekuje się tobą.


1
Ładny! Używam ctrl + shift + - od zawsze i teraz mogę znaleźć i zmienić skrót.
GeorgiG

Musiałem go zainstalować, nie pojawił się w mojej instalacji 1.37.1
stary mnich

67

Jeśli jesteś ciężkim użytkownikiem Visual Studio, możesz po prostu otworzyć ustawienia preferencji i dodać następujące elementy do pliku settings.json:

...
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
  "source.organizeImports": true
}
....

Mam nadzieję, że może to być pomocne!


3
Wydaje się, że jest to sprzeczne z wtyczką ESLint Prettier. Próbuje dokonać importu jednowierszowego, ale ESLint próbuje podzielić wiele wierszy.
Richard

Ten sam problem co @Richard. Wydaje się, że jest to otwarty problem - github.com/prettier/prettier-vscode/issues/716
Craig

Czy istnieje sposób, aby wyłączyć usuwanie nieużywanych importów, zachowując sortowanie importu?
sunknudsen

świetna odpowiedź. szukałem tego od wieków
Aamir Afridi

42

Aby móc wykryć nieużywane importy, kod lub zmienne, upewnij się, że masz te opcje w pliku tsconfig.json

"compilerOptions": {
    "noUnusedLocals": true,
    "noUnusedParameters": true
}

mieć zainstalowany kompilator maszynopisu, jeśli nie, zainstaluj go z:

npm install -g typescript

i rozszerzenie tslint zainstalowane w Vcode, działało to dla mnie, ale po włączeniu zauważam wzrost użycia procesora, szczególnie w dużych projektach.

Poleciłbym również użycie rozszerzenia Hero do organizowania importu.


42

Od VSCode v.1.24 i TypeScript v.2.9:

W przypadku komputerów Mac: option+ Shift+O

Dla Win: Alt+ Shift+O


7
ważniejsze dla niektórych jest polecenie Organize Importsoreditor.action.organizeImports
pcnate

1
@pcnate Czy istnieje sposób, aby wyłączyć usuwanie nieużywanych importów, zachowując sortowanie importu?
sunknudsen

12

W tym wątku jest już tak wiele dobrych odpowiedzi! Zamierzam to opublikować, aby pomóc każdemu, kto próbuje to zrobić automatycznie ! Ten artykuł był dla mnie bardzo pomocny w automatycznym usuwaniu nieużywanych importów z całego projektu .

W artykule autor wyjaśnia to tak:

Utwórz samodzielny plik tslint, który zawiera następujące elementy:

{
  "extends": ["tslint-etc"],
  "rules": {
    "no-unused-declaration": true
  }
}

Następnie uruchom następujące polecenie, aby naprawić import:

 tslint --config tslint-imports.json --fix --project .

Rozważ naprawienie innych generowanych przez siebie błędów. (Zrobiłem)

Następnie sprawdź prace projektu budując go:

ng build

lub

ng build name_of_project --configuration=production 

Koniec: jeśli buduje się poprawnie, pomyślnie usunąłeś import automatycznie!

UWAGA: To usuwa tylko niepotrzebne importy. Nie zapewnia innych funkcji, które zapewnia VS Code podczas korzystania z jednego z wcześniej wymienionych poleceń.


Rozumiem Could not find implementations for the following rules specified in the configuration: no-unused-declaration , więc myślę, że to rozwiązanie już nie działa.
Yousuf Khan

Używam wersji tslint5.20.1
Yousuf Khan

0

przejdź do swojego tslint.jsoni zmień wartość nieruchomości no-unused-variablenafalse


3
To jest dokładnie odwrotność tego, o co prosił PO. Chce NIE mieć nieużywanych zmiennych, więc no-unused-variablepowinno być prawdziwe. Pytano, czy poprawka (usunięcie nieużywanych zmiennych) może być wykonana automatycznie, na co już udzielono odpowiedzi.
mattarau
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.