"javascript", "angular", "typescript" 환경에서 발생하는 "npm WARN ... requires a peer of ... but none is installed. You must install peer dependencies yourself" 에 대한 해결 방법
"javascript", "angular", "typescript"와 관련된 "npm WARN ... requires a peer of ... but none is installed. You must install peer dependencies yourself" 에 대한 설명
"javascript", "angular", "typescript" 환경에서 npm install
명령을 실행했을 때 다음과 같은 경고 메시지가 나타날 수 있습니다.
npm WARN ... requires a peer of ... but none is installed. You must install peer dependencies yourself.
원인
이 경고 메시지는 특정 패키지가 다른 패키지 (peer dependency)에 의존하지만 해당 peer dependency가 설치되지 않았을 때 나타납니다.
해결 방법
peer dependency 설치
경고 메시지에 표시된 peer dependency를 직접 설치하여 문제를 해결할 수 있습니다. 예를 들어, 경고 메시지가 다음과 같다면
npm WARN @angular/[email protected] requires a peer of rxjs@^6.0.0 but none is installed. You must install peer dependencies yourself.
rxjs@^6.0.0
패키지를 다음 명령을 사용하여 설치해야 합니다.
npm install rxjs@^6.0.0
--legacy-peer-deps 플래그 사용
npm install
명령에 --legacy-peer-deps
플래그를 추가하면 peer dependency를 자동으로 설치할 수 있습니다. 예를 들어, 다음 명령을 사용하여 @angular/common
패키지를 설치할 수 있습니다.
npm install @angular/common --legacy-peer-deps
package.json 파일 수정
경고 메시지에 표시된 peer dependency를 package.json
파일의 dependencies
섹션에 직접 추가하여 문제를 해결할 수도 있습니다. 예를 들어, 다음과 같이 rxjs
패키지를 dependencies
섹션에 추가할 수 있습니다.
{
"dependencies": {
"@angular/common": "^6.0.9",
"rxjs": "^6.0.0"
}
}
참고 사항
--legacy-peer-deps
플래그는 npm 버전 5 이상에서만 사용할 수 있습니다.package.json
파일을 직접 수정하는 방법은 peer dependency 버전 관리가 어려울 수 있으므로 주의해야 합니다.
추가 정보
관련 검색어
- npm WARN
- peer dependency
- javascript
- angular
- typescript
예제 코드
예제 1:
import { Component } from '@angular/core';
import { Observable } from 'rxjs';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
name = 'Angular';
constructor() {
// Observable 을 사용하려면 rxjs 패키지가 설치되어 있어야 합니다.
const observable = new Observable();
}
}
이 코드를 실행하면 다음과 같은 경고 메시지가 나타납니다.
npm WARN @angular/[email protected] requires a peer of rxjs@^6.0.0 but none is installed. You must install peer dependencies yourself.
해결 방법:
rxjs@^6.0.0
패키지를 설치합니다.
npm install rxjs@^6.0.0
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
name = 'Angular';
constructor(private router: Router) {
// Router 를 사용하려면 @angular/router 패키지가 설치되어 있어야 합니다.
this.router.navigate(['/home']);
}
}
npm WARN @angular/[email protected] requires a peer of @angular/router@^6.0.0 but none is installed. You must install peer dependencies yourself.
@angular/router@^6.0.0
패키지를 설치합니다.
npm install @angular/router@^6.0.0
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
name = 'Angular';
constructor(private http: HttpClient) {
// HttpClient 을 사용하려면 @angular/common/http 패키지가 설치되어 있어야 합니다.
this.http.get('https://api.github.com/users/angular').subscribe(data => {
console.log(data);
});
}
}
npm WARN @angular/[email protected] requires a peer of @angular/common/http@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm install @angular/common/http@^6.0.0
추가 예제
다양한 peer dependency 관련 예제는 다음 링크에서 확인할 수 있습니다.
- 이 예제 코드는
npm WARN
경고 메시지와 해결 방법을 보여주기 위한 목적으로만 작성되었습니다. - 실제 프로젝트에서는 상황에 맞는 코드를 작성해야 합니다.
"npm WARN ... requires a peer of ... but none is installed. You must install peer dependencies yourself" 문제 해결을 위한 대체 방법
npm install @angular/common --legacy-peer-deps
yarn 사용
yarn add @angular/common
pnpm 사용
pnpm install @angular/common
직접 설치
npm WARN @angular/[email protected] requires a peer of rxjs@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm install rxjs@^6.0.0
{
"dependencies": {
"@angular/common": "^6.0.9",
"rxjs": "^6.0.0"
}
}
주의 사항
javascript angular typescript