1. Angular 설치를 위한 사전 준비
- Angular를 로컬 환경에 설치하기 위해서는 Node.js, npm package manager 가 필요하다.
- npm package manager 은 Node.js를 설치하면 같이 설치가 된다.
- Node.js 설치 URL : nodejs.org
- Node.js 설치 확인
node -v
- npm 설치 확인
npm -v
2. Angular CLI 설치
- 터미널 실행 (cmd)
- 터미널에 아래 명령어 실행
npm install -g @angular/cli
- 설치 확인
ng version
2-1. ? Would you like to share pseudonymous usage data about this project with the Angular Team
at Google under Google's Privacy Policy at https://policies.google.com/privacy. For more
details and how to change this setting, see https://angular.io/analytics.
- 버전 확인 명령어 실행시 위 메세지가 출력되는 경우가 있는데 사용 데이터를 Angular 팀과 공유하겠냐는 질문이니 y/N 선택해주시면 됩니다. 저는 N 선택했습니다.
3. Visual Studio Code(VSCode) 설치
- 설치 URL : https://code.visualstudio.com/download
- Node.js 설치 이후에 VSCode를 실행해주세요. (설치 이전에 실행시켰다면 다시 껐다 켜주세요.)
4. VSCode에서 ng 명령어 사용할 수 있도록 권한 변경
- VSCode에서 ng 명령어를 사용하려면 권한을 변경해줘야 합니다.(Windows)
- VSCode 터미널 창에 ng 명령어를 사용했을 경우 권한 변경을 해주지 않았다면 아래 명령어가 출력됩니다.
ng : 이 시스템에서 스크립트를 실행할 수 없으므로..... ng.ps1 파일을 로드할 수 없습니다. 자세한 내용은 about_Execution_Policies(https://go.microsoft.com/fwlink/?LinkID=13
5170)를 참조하십시오.
- Windows PowerShell을 관리자 권한으로 열어주세요. (cmd창 안됩니다.)
- 현재 권한 확인
get-ExecutionPolicy
- 현재는 권한이 제한되어 있다고 나옵니다.
- 저희는 스크립트를 실행할 수 있는 RemoteSigned 권한으로 변경해줄 겁니다.
Set-ExecutionPolicy RemoteSigned
Y
- get-ExecutionPolicy 명령어로 권한이 잘 변경됐는지 확인해주세요.
- RemoteSigned 이외에 다른 권한 종류에 대해선 아래 링크에서 확인해 주세요.
5. Angular extensions 설치
- Extensions 는 Visual Studio Code의 확장 기능으로 개발 시 편리한 기능들을 제공해준다.
- Angular 개발에 필요한 Extensions 설치하기 위해 Extensions 탭 클릭 (단축키 : Ctrl + Shift + X)
- Angular Language Service 설치해서 사용을 해 줄 텐데 해당 서비스가 제공해주는 기능은 자동완성, 문법 체크 등의 기능을 제공한다.
- 이미 설치했기 때문에 Uninstall이 표기가 되는데, 설치되지 않은 서비스는 install 버튼이 있으니 install 누르면 된다.
'Angular' 카테고리의 다른 글
Angular 3. Routing 구성하기(lazy-loading: 지연 로딩) (0) | 2022.11.29 |
---|---|
Angular 2. bootstrap 템플릿 적용 (0) | 2022.11.29 |
Angular 1. 홈페이지 만들기 전 준비 및 개발 참고 사이트 (0) | 2022.11.23 |
Angular 소스 git clone 후 node_modules 폴더 없을 경우 (0) | 2022.11.21 |
Angular 프로젝트 생성 (0) | 2022.11.16 |