Angular CLI로 구성 요소 추가

VScode에서 Angular를 사용하여 뭔가를 만들려고하지만, 구성 요소를 쉽게 추가하는 방법을 씁니다.

Angular CLI에서 구성 요소를 추가합시다.



Angular CLI를 설치하면 명령으로 구성 요소를 쉽게 추가할 수 있습니다.

Angular CLI 설치



VSCode 터미널에서 다음 명령을 실행합시다.
npm install  @angular/cli

버전 지정


npm install  @angular/[email protected]

설치할 수 있었는지 일단 확인


ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 8.3.19
Node: 12.12.0
OS: darwin x64
Angular: 8.0.3
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.9
@angular-devkit/build-angular     0.13.9
@angular-devkit/build-optimizer   0.13.9
@angular-devkit/build-webpack     0.13.9
@angular-devkit/core              7.3.9
@angular-devkit/schematics        8.3.19
@angular/cli                      8.3.19
@ngtools/webpack                  7.3.9
@schematics/angular               8.3.19
@schematics/update                0.803.19
rxjs                              6.5.3
typescript                        3.4.5
webpack                           4.29.0

확실합니다

구성 요소 추가



다음 명령은 구성 요소를 추가합니다.
ng g component component-name

실행하면 다음과 같이 파일이 생성됩니다.
component-name
└ component-name.component.css
└ component-name.component.html
└ component-name.component.spec.ts
└ component-name.component.ts

나머지는 원하는대로 구현합시다! ! !

좋은 웹페이지 즐겨찾기