Angular CLI를 사용하여 특정 폴더에 컴포넌트를 생성하는 방법

Angular CLI를 사용하여 특정 폴더에 컴포넌트를 생성하는 방법

Angular 4를 Angular CLI와 함께 사용하고 있으며 다음 명령으로 새로운 컴포넌트를 만들 수 있습니다.

E:\HiddenWords>ng generate component plainsight

하지만 초원지대에 아이 부품을 만들어야 해Angular CLI로 할 수 있는 방법이 있나요?

ng g component plainsight/some-name사용할 때 새 디렉토리를 만듭니다.

최종 출력은 다음과 같습니다.

plainsight/some-name/some-name.component.ts

이를 피하려면 플랫 옵션을 사용합니다. ng g component plainsight/some-name --flat새 폴더를 만들지 않고 파일을 생성합니다.

plainsight/some-name.component.ts

특정 디렉토리에 컴포넌트를 작성하는 방법에는 몇 가지가 있습니다.

방법 1: "온보드 터미널에서 열기" - 빠르고 단순하며 오류가 없는 방법

,, 포, 포, 성, 성, 성, 성, 성, 성에 구성 요소를 합니다.app/common.

1. 구성 요소를 생성할 폴더를 마우스 오른쪽 버튼으로 누르십시오.
2. " " 를 합니다.Open in Integrated Terminal ★★★★★★★★★★★★★★★★★」Open in Command Prompt.
3. 새 터미널(선택한 경로가 표시됨)에 다음을 입력합니다.ng g c my-component

또한 이 이미지를 통해 이 과정을 확인할 수 있습니다.

방법 2: "상대 경로 복사" 및 터미널에 붙여넣기

1. 구성 요소를 생성할 폴더를 마우스 오른쪽 버튼으로 누르십시오.
2. 메뉴에서 [ ]를 합니다.Copy Relative Path
3. 경우, 침음음음음음음음음음음음음음음 on라고 합니다.cd, + 를 눌러 복사한 경로를 붙여넣고,
4. 디렉토리가 변경된 것을 알 수 있습니다.

또한 이 이미지를 통해 이 과정을 확인할 수 있습니다.

방법 3: 단말기에 complete

'만들고 ', '만들고 싶다', '만들고 싶다' 등component일부 폴더에서는 경로 및 구성 요소 이름을 포함한 전체 명령을 입력합니다.

ng g c relative-path/my-component

또한 이 이미지를 통해 이 과정을 확인할 수 있습니다.

주의 (방법-3): angular에서는 앱 폴더 외부에 컴포넌트를 작성할 수 없기 때문에 컴포넌트의 경우 베이스 패스가 앱이 되기 때문에 저는 처음에 이 컴포넌트로 시작해야 했습니다.auth/a-componentsrc/app/auth/a-component

ng g c component-name

로케이션을 하려면 , 「」를 참조해 .ng g c specific-folder/component-name

(여기서)component-name이치노

은 ''와 같은 다른 할 때 할 수 .directive,pipe,service,class,guard,interface,enum,module 등등.

more : " " " " " " " " " 。ng g c component-name
하려면 , 「 」를 참조해 주세요.ng g c specific-folder/component-name

정보 ★★★★
디렉티브: " " " " " " " " " " " " " :ng g d directive-name
하려면 , 「 」를 참조해 주세요.ng g d specific-folder/directive-name

위의 옵션은 터미널에서 디렉토리 또는 파일을 작성하는 것과 달리 CLI가 컴포넌트를 생성하면 기본적으로 입력한 경로에 src/app 경로가 추가되기 때문에 사용할 수 없었습니다.

이렇게 메인 앱 폴더에서 컴포넌트를 생성하면 (WORLG WAY)

ng g c ./src/app/child/grandchild 

생성된 컴포넌트는 다음과 같습니다.

src/app/src/app/child/grandchild.component.ts

그래서 타이핑만 하면 됐다.

ng g c child/grandchild 

이게 도움이 됐으면 좋겠는데

ng generate component ./target_directory/Component_Name'을 사용합니다.

초간단,

다른 방법이다.

터미널에서 폴더 이동,

**xxx\FOLDER_NAME>CD FOLDER_NAME

xxx\FOLDER_NAME>ng 컴포넌트 플레인사이트 생성

내가 경로를 복사하길 원한다면 보너스 포인트(Visual Studio Code),

특정 폴더 내에 컴포넌트를 만듭니다.

ng g c folder-name/component-name

Angular-CLI를 사용하여 특정(기존) 모듈의 폴더 내에 컴포넌트를 만듭니다.

ng g c folder-name/component-name --module=folder-name/moduleName.module.ts

ng g c folderName/SubFolder/.../componentName --spec=false 

위의 답변은 전혀 운이 없었습니다.--flat하지만 제게 효과가 있었던 건

cd path/to/specific/directory

기서, 는 the를 했다.ng g c mynewcomponent

VS를 합니다.CTRL+~터미널이 열립니다.을 사용하다

1. 새 구성 요소를 생성해야 하는 특정 구성 요소를 확인합니다.

2. 다른 컴포넌트를 생성해야 하는 특정 폴더/컴포넌트로 경로를 재연결합니다.

§:cd src/app/particularComponent

specificComponent 대신 새 구성 요소를 생성해야 하는 구성 요소 이름을 입력하십시오.

3. 컴포넌트를 합니다.ng g c NewComponentName

(New ComponentName 이름을 필요한 컴포넌트 이름으로 변경합니다).

Angular CLI 。 사항은 하실 수 있습니다.ng g )ng generate를 사용하여 을 완료합니다를 사용하여 작업을 완료합니다.

ng g c directory/component-namecomponent-name의 directory더입니니다다

다음은 응용 프로그램에서 사용할 수 있는 몇 가지 간단한 명령어 맵입니다.

1. ng g c comp-name ★★★★★★★★★★★★★★★★★」ng generate component comp-name comp-name'이라는
2. ng g s serv-name ★★★★★★★★★★★★★★★★★」ng generate service serv-nameserv-name'이라는
3. ng g m mod-name ★★★★★★★★★★★★★★★★★」ng generate module mod-name' mod-name'이라는 이름의 .
4. ng g m mod-name --routing ★★★★★★★★★★★★★★★★★」ng generate module mod-name --routing' 라우팅은 'mod-name'으로 지정합니다.

이게 도움이 됐으면 좋겠네요!

행운을 빕니다.

사용자 정의 디렉토리를 사용할 때 --dryRun을 사용해야 합니다.

는, 커스텀 디렉토리 패스와 수 .ng명령어를 입력합니다.

ng g c myfolder\mycomponent

그러나 경로 철자가 잘못 입력되어 새 폴더가 생성되거나 디렉토리 변경 대상이 될 수 있습니다. 에, 「 」dryRun많은 도움이 됩니다.변경이 어떻게 영향을 받는지에 대한 출력이 표시됩니다.

결과를 확인한 후 동일한 명령어를 실행할 수 있습니다.-d변경을 가할 수 있습니다.

--dryRun=true|false

참일 경우 결과를 쓰지 않고 작업을 실행하고 보고합니다.

디폴트: false

에일리어스: -d

공식 문서:- https://angular.io/cli/generate

2021 IDE 플러그인으로 더욱 고속화

이 통상적인 프로세스를 한층 더 고속화해, 시간이 걸리는 일반적인 실수를 피하고 싶은 경우는, 비주얼 스튜디오 코드 플러그 인을 사용해 주세요.

예를 들어 Angular-Schematics를 사용하고 터미널을 피합니다.마우스를 선택하여 ng cli를 호출할 수 있습니다.

특정 폴더를 엽니다. 터미널에서 이 명령을 사용합니다.

ng g c 컴포넌트 이름 --flat

간단하죠.

ng g component plainsight/some-name

그러면 "일반" 폴더가 생성되고 그 안에 이름 있는 구성 요소가 생성됩니다.

사용해보십시오.

ng g component plainsight/some-name.component.ts

아니면 당신이 더 편하다면 수동으로 시도해 보세요.

명령 프롬프트 또는 프로젝트 터미널에서 프로젝트 폴더로 이동합니다.

cmd : ng g c 컴포넌트명을 실행합니다.

프로젝트의 디렉토리에 들어가면,사용하다cd path/to/directory그 후ng g c component_name모든 것을 자동화하여 오류 없이

그g c평균 구성 요소 생성

먼저 사용해야 할 컴포넌트를 작성하기 위해:-

• ng g c 컴포넌트명

  위의 명령어를 사용하면 새 컴포넌트가 다음 폴더 내에 생성됩니다.
  (componentname) 위에서 지정했습니다.

그러나 다른 컴포넌트 내부 또는 특정 폴더에 컴포넌트를 작성해야 하는 경우:-

• ng g c c c component name / new Component Name

VSCode를 사용하는 경우 Angular Console을 사용하는 것이 좋습니다.

Angular CLI 의 인터페이스를 제공합니다.경로를 지정하는 옵션이 나타납니다.

Angular CLI는 매우 강력하고 확장성이 뛰어납니다.실제로, 사용 가능한 모든 명령어에 대해 다양한 구성 옵션을 모두 갖추는 것이 개발자에게 도움이 될 정도로 많은 기능이 있습니다.

Angular Console을 사용하면 가장 쉽게 잊히거나 거의 사용하지 않는 기능까지 추천받을 수 있습니다.

Angular Console은 무엇보다도 Angular CLI에서 제공하는 기능을 보다 효율적으로 사용할 수 있는 방법입니다.

컴포넌트를 작성한다.Container모듈로Box모듈이 이미 생성되어 자체 폴더에 존재합니다.src/app/box.

이 작업을 수행할 수 있습니다. 구성 요소 이름을 묻는 메시지가 나타나면 구성 요소 및 구성 요소 이름의 경로를 제공합니다.

ng g c -m box
? What name would you like to use for the component? box/Container
CREATE src/app/box/container/container.component.scss (0 bytes)
CREATE src/app/box/container/container.component.html (24 bytes)
CREATE src/app/box/container/container.component.spec.ts (647 bytes)
CREATE src/app/box/container/container.component.ts (288 bytes)
UPDATE src/app/box/box.module.ts (286 bytes)

터미널 창을 열고 Angular 프로젝트의 루트로 이동합니다.폴더를 작성하다

다음 명령을 실행하여 특정 폴더에 새 구성 요소를 생성합니다.

ng generate component <folderName>/<componentName>

예를 들어 "components"라는 폴더에 "myComponent"라는 새 구성요소를 작성하려면 다음 명령을 사용합니다.

ng generate component components/myComponent

언급URL : https://stackoverflow.com/questions/46851399/how-to-generate-components-in-a-specific-folder-with-angular-cli