Angular Browserslist : caniuse-lite가 오래되었습니다. 다음 명령`npm update`를 실행하십시오

최근에 작업중 인 Angular 8 프로젝트 (노드 v10.16.0) 에서이 오류가 발생하기 시작했습니다. npm update caniuse-lite browserslist를 실행해도 아무것도 수행되지 않았습니다.

그래서 package-lock.json을 제거하고 node_modules를 제거하고 npm install을 실행했지만 browserlist 파일은 사라졌습니다. ng build를 다시 실행하면 동일한 메시지가 표시됩니다. Browserslist : caniuse-lite가 오래되었습니다. 다음 명령을 실행하십시오npm update

이 게시물은 같은 주제에 있습니다 : Browserslist : caniuse-lite is old. 다음 명령 'npm update caniuse-lite browserslist'를 실행하십시오. 그러나 WebCompiler와 autoprefixer에 대해 이야기하고 있으며 그 사실을 모릅니다. 안내해주세요

angular npm-install

— 은어
소스

Q : Visual Studio로이 Angular 프로젝트를 만들었습니까? Q : 지시 사항을 따르고 실행하면 npm update caniuse-lite browserslist어떻게됩니까?

— FoggyDay

예, 각도 프로젝트는 Visual Studio 2017을 사용하고 있습니다. npm update caniuse-lite browserslist를 사용할 때 아무 반응이 없습니다. 아무것도 설치되지 않습니다 ...

— SilverFish

새로 npm을 설치 한 후 browserlist 파일이 사라 졌으므로 (caniuse-lite가 있음) browserlist에서 npm을 실행해야합니까?

— SilverFish

방금 같은 문제가 발생했습니다. phpstrom에서 그것은 나에게 실행을 지시 npm update하지만 이것은 문제를 해결하지 못했고, 그냥 앵귤러 8에 대한 내 typescript 버전을

— 높였습니다.

편집기 가이 충돌을 일으키는 이유를 모르겠지만 Visual Studio 코드를 사용하는 Angular 8에서도 동일한 문제가 발생합니다. 아직 답변이 없습니까? 우리는 이번 주에 새로운 기능을 출시 할 예정이며 이제는 앱이 빌드되지 않습니다. browserlist를 사용하여 여러 node_modules를 볼 수 있습니다

— HomeBrew

답변:

아래 명령을 실행하여 caniuse-lite 오래된 문제를 해결했습니다.

npm cache clean  # optional
npm install caniuse-lite@latest --save

— 담금
소스

npm cache clean최신 버전에서는 npm이 자동으로 처리하므로 직접 작동하지 않습니다. 우리가 사용하기를 원하십니까 --force? 그렇다면, 왜 우리가 캐시를 압축해야하는지 설명하십시오.

— 비슈누 데프

npm 캐시 정리는 필요하지 않습니다. 직접 실행할 수 있습니다npm install caniuse-lite@latest --save

— Dipten

package.json bloat을 통해 앱에 caniuse-lite를 추가하는 것은 좋지 않습니다. 앱의 종속성이 아니기 때문에 npm 툴셋 만 있기 때문입니다. 아래의 자세한 설명을 참조하십시오. 또한 '-저장'은 이제 기본 설치 작업이므로 중복됩니다.

— jdh

이것은 나를 위해 caniuse-lite를 성공적으로 설치하지만 여전히 같은 오류가 발생합니다.

— nullmn

노드 10.x로 시도해 보았습니다. 노드 버전을 확인하십시오.

— Dipten

TLDR : (설명없이 반 직관적으로 보일 수 있음)

  npm install caniuse-lite browserslist
  npm uninstall caniuse-lite browserslist

설명:

이 경고 메시지 ( "canisuse-lite가 오래되었습니다. 제발 ....")는 설치된 버전의 caniuse-lite가 현재 버전에서 2 개보다 오래된 버전을 찾으면 빌드 / 시작 중에 browserslist의 스크립트에 의해 출력됩니다. 프로젝트에서 아무것도 변경되지 않고 프로젝트를 시작하거나 빌드 할 때 갑자기이 메시지가 표시되면, 아마도 최신 버전의 caniuse-lite가 업데이트 된 것입니다.

불행히도, browserslist가 표시하는 텍스트 메시지는 프로젝트의 종속성으로 caniuse-lite를 설치 한 경우에만 유용합니다. 아마 당신은하지 않았습니다. 따라서 제안 된 'npm update caniuse-lite'또는 'npm update'caniuse-lite @ latest '(또는'npm install ')를 실행하면 npm은 package.json 종속성에 나열된 패키지를 볼 수 없으므로 무시합니다. 요청.

그 패키지들은 어떻게 의존성이 되었습니까? 프로젝트가 생성되었을 때 (앱 angularapp 또는 create-react-app 또는 프레임 워크와 유사) npm은 browserslist를 프로젝트의 종속성 중 하나가 아닌 필요한 도구의 종속성으로 설치했습니다. 동시에, caniuse-lite는 browserslist의 종속 항목으로 설치되었습니다. 나중에 프로젝트가 업데이트되면 package-lock.json 파일이 만들어져 모든 종속성을 특정 버전으로 잠급니다.

package-lock.json의 종속성 목록에서 버전 정보를 업데이트 할 수있는 경우 'npm install'을 실행하면 node_modules에서 이러한 패키지가 업데이트됩니다. package-lock.json을 수동으로 편집해서는 안됩니다. 대신 가장 좋은 방법은 다음과 같습니다.

이러한 패키지를 프로젝트의 종속성으로 임시 설정하십시오.

npm install caniuse-lite 브라우저 목록

패키지를 최신 버전으로 업데이트하는 것 외에도 package.json 및 가장 중요한 package-lock.json의 종속성 목록이 업데이트됩니다.
프로젝트의 직접적인 종속성으로 다음 패키지를 제거하십시오.

npm uninstall caniuse-lite 브라우저 목록

이러한 패키지는 다른 종속성에 의해 사용되므로 node_modules에서 제거되지 않습니다. package.json 만 프로젝트 종속성으로 제거하도록 업데이트되었습니다.
package-lock.json을 커밋하십시오. 다른 사람은 이제 'npm install'을 실행하여 package-lock.json의 하위 종속성 목록에서 업데이트 된 두 패키지를 가져오고 경고 메시지를 중지 할 수 있습니다.

— jdh
소스

귀하의 솔루션을 시도했지만 여전히이 메시지 (브라우저 목록 : caniuse-lite가 오래되었습니다. 다음 명령을 실행하십시오 npm update)와 깨끗한 각도 설정에 대한 경고가 표시 됩니다.

— Alexander Kushnir

@AlexanderKushir-1 단계에서 설치를 수행 한 후 browserslist 및 caniuse-lite의 node_modules에서 개별 패키지의 버전을 확인하십시오 .json이 업데이트되었는지 (caniuselite의 경우 1.0.30001019, 브라우저 목록의 경우 4.8.3) 오늘의). 새로운 버전의 browserlist (4.8.3)는 canisuelite가 업데이트되지 않은 경우에만 불만을 제기해야합니다. 이 두 패키지를 업데이트하지 않는 캐싱 서버가 .npmrc에 설정되어 있습니까? (있는 경우 설치하기 전에 일시적으로 .npmrc의 이름을 바꾸시겠습니까?)

— jdh

나는 단지 모든 것을 위해해야 caniuse-lite했고 메시지는 사라졌다

— MoonStom

@ MoonStom-caniuse-lite 만 설치하면 앱의 의존성으로 추가하지만 정확하지 않습니다. 문제는 npm 및 browserslist에 있습니다. 일단 수정되면 앱은 caniuse-lite에 의존해서는 안됩니다.

— jdh