폴더 이름, .css, .ts, spec.ts 및 app.module.ts와 같은 모든 구성 요소 파일을 수동으로 편집하는 것 외에 Angular CLI로 구성 요소의 이름을 바꾸는 바로 가기가 있습니까?
답변
아니!
component create 명령을 사용하여 생성 된 모든 파일의 이름을 변경하는 명령이 없습니다. 그래서 만든 ts
, html
, css/scss
, .spec.ts
파일을 수동으로 / 이름 편집 할 필요가있다.
나는 자주 사용자이며 angular cli
각도 구성 요소를 만들고 이름을 바꿔야하기 때문에 이것이 좋은 명령이라고 생각합니다. 이 이름 바꾸기 명령이 없으므로 생성 된 각도 구성 요소, 지시문 등을 삭제하고 명령을 다시 실행하여 구성 요소를 작성하는 것은 실제로 어려움입니다.
이 기능을 추가하는 토론 링크는 각도 구성 요소 이름 바꾸기
답변
현재 Angular CLI는 코드 이름 변경 또는 리팩토링 기능을 지원하지 않습니다.
일부 IDE의 도움으로 이러한 기능을 수행 할 수 있습니다.
Intellij, Eclipse, VSCode 등은 기본적으로 리팩토링을 지원합니다.
요즘 VSCode는 상승 추세를 보이고 있습니다. 개인적 으로이 팬입니다.
VSCode를 사용한 리팩토링
결정 참조 :-VS Code는 변수를 선택하고 단축키 SHIFT
+를 눌러 변수의 모든 참조를 찾는 데 도움이 F12
됩니다. 이것은 Type Script와 매우 잘 작동합니다.
모든 참조 인스턴스 이름 바꾸기 :-모든 참조를 찾은 후을 누르면 F2
팝업이 열리고 값을 변경하고 Enter를 클릭하면 모든 참조 인스턴스가 업데이트됩니다.
파일 및 가져 오기 이름 바꾸기
플러그인을 사용하여 파일 및 가져 오기 참조의 이름을 바꿀 수 있습니다. 자세한 내용은 여기를 참조 하십시오
변수 및 파일 이름을 바꾼 후 위 단계를 수행하면 각도 구성 요소 이름을 바꿀 수 있습니다.
답변
각도 이름 변경 참조
설치
npm install -g angular-rename
사용하다
$ ./angular-rename OldComponentName NewComponentName
답변
OP가 CLI 명령을 요청하는 동안 일부 답변은 IDE에 중점을 둡니다. 이 답변에서는 현재 WebStorm / IntelliJ가 구성 요소 이름을 바꿀 수 있음을 확인했습니다. .ts
파일 에서 클래스 이름을 바꾸려고하면 됩니다. 당신은 제시 될 것이다 :
이름 바꾸기는 모든 관련 장소에서 수행됩니다.
답변
첫 번째 답변에서 알 수 있듯이 현재 구성 요소의 이름을 바꿀 수있는 방법이 없으므로 모두 해결 방법에 대해서만 이야기하고 있습니다! 이것이 제가하는 것입니다:
-
원하는 새 구성 요소를 작성하십시오.
ng 구성 요소 newName 생성
-
Visual Studio 코드 편집기 또는 다른 편집기를 사용하여 코드 / 조각을 나란히 편리하게 이동하십시오!
-
Linux에서는 grep & sed (찾기 및 바꾸기)를 사용하여 참조를 찾거나 교체하십시오.
grep -ir “이전 이름”
당신의 폴더를 cd
sed -i ‘s / oldName / newName / g’*
답변
나는 개인적으로 같은 명령을 찾지 못했습니다. 그냥 새 구성 요소 (이름이 바뀐 이름)을 확인하고 이전 구성 요소의 붙여 넣기 복사 html
, css
하고 ts
. 에서 ts
분명히 클래스 이름은 대체 될 것입니다. 가장 안전한 방법이지만 시간이 조금 걸립니다.
답변
WebStorm에서 TypeScript 파일의 구성 요소 이름을 마우스 오른쪽 버튼으로 클릭 → 리팩터링 → 이름 바꾸기를 클릭하면 어디서나 이름이 변경됩니다.