vs 코드는 '@ angular / core'모듈 또는 다른 모듈을 찾을 수 없습니다.

내 프로젝트는 [Angular CLI] 버전 1.2.6으로 생성되었습니다.

프로젝트를 컴파일 할 수 있고 잘 작동하지만 항상 '@ angular / core'모듈을 찾을 수 없음 '@ angular / router'모듈을 찾을 수 없다는 오류가 발생합니다.

내 tsconfig.json 파일의 내용을 첨부했습니다. 이것은 저에게 정말 실망 스러웠습니다. 무엇이 잘못되었는지 알아 내기 위해 2 시간을 소비했으며 작동하지 않는 vs 코드를 제거하고 다시 설치했습니다.

내 환경 사양은 다음과 같습니다.

@angular/cli: 1.2.6
node: 6.9.1
os: win32 x64
@angular/animations: 4.3.4
@angular/common: 4.3.4
@angular/compiler: 4.3.4
@angular/core: 4.3.4
@angular/forms: 4.3.4
@angular/http: 4.3.4
@angular/platform-browser: 4.3.4
@angular/platform-browser-dynamic: 4.3.4
@angular/router: 4.3.4
@angular/cli: 1.2.6
@angular/compiler-cli: 4.3.4
@angular/language-service: 4.3.4

os : Microsoft 대 10 기업

프로젝트 루트 폴더

.angular-cli.json
.editorconfig
.gitignore
.vscode
e2e
karma.conf.js
node_modules
package.json
protractor.conf.js
README.md
src
tsconfig.json
tslint.json

node_module 폴더

-@angular
--animations
--cli
--common
--compiler
--compiler-cli
--core
---@angular
---bundles
---core.d.ts
---core.metadata.json
---package.json
---public_api.d.ts
---README.md
---src
---testing
---testing.d.ts
---testing.metadata.json
--forms
--http
--language-service
--platform-browser
--platform-browser-dynamic
--router
--tsc-wrapped
@ng-bootstrap
@ngtools
-@types
--jasmine
--jasminewd2
--node
--q
--selenium-webdriver

tsconfig.json :

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2016",
      "dom"
    ]
  }
}

내 자신이 만든 구성 요소 / 서비스를 가져 오는 동안에 만이 문제에 직면했습니다. 저와 같은 사용자에게 허용 된 솔루션이 작동하지 않는 경우 다음을 시도해 볼 수 있습니다.

더하다

"baseUrl": "src"

귀하의 tsconfig.json. 그 이유는 비주얼 코드 IDE가 기본 URL을 확인할 수 없으므로 가져온 구성 요소에 대한 경로를 확인할 수없고 오류 / 경고를 제공하기 때문입니다.

각도 컴파일러는 src기본적으로 baseurl을 사용하므로 컴파일 할 수 있습니다.

노트:

이 변경 사항을 적용하려면 VS Code IDE를 다시 시작해야합니다.

편집하다:

주석 중 하나에서 언급했듯이 경우에 따라 작업 영역 버전 변경도 작동 할 수 있습니다. 자세한 내용은 여기 : https://github.com/Microsoft/vscode/issues/34681#issuecomment-331306869

각도 프로젝트에서 누락되었을 가능성이 가장 높은 node_modules 패키지는 다음을 실행합니다.

npm install

각도 프로젝트 폴더 안에 있습니다.

업데이트 또는 설치 또는 캐시 삭제시 Visual Code를 다시 시작해야합니다.

나를위한 해결책은 실행하는 것이었다

npm install

언로드 한 다음 Visual Studio에서 프로젝트를 다시로드합니다.

나는 angular 5오늘 내 응용 프로그램 에서이 문제에 직면했습니다 . 그리고 나를 도운 수정은 간단했습니다. 파일 에 추가 "moduleResolution": "node"했습니다 . 내 전체 파일 내용은 다음과 같습니다.compilerOptionstsconfig.jsontsconfig.json

{
  "compileOnSave": false,  
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

moduleResolution모듈 해상도 전략을 지정합니다. 이 설정의 값은 node또는 일 수 있습니다 classic. 여기에서 이에 대한 자세한 내용을 읽을 수 있습니다 .

프로젝트 폴더에서 Node Modules 폴더를 삭제하고 아래 명령을 실행하십시오.

npm cache clean --force npm install

작동합니다.

다음을 사용해보십시오.

npm audit fix --force

그리고:

npm install --save @ng-bootstrap/ng-bootstrap

@ng-bootstrap/ng-bootstrap전 세계적으로 저축하는 대신 .

나는 같은 문제가 있었다. "C : \ Users \ Administrator \ AppData \ Roaming \ npm-cache"에 있는 npm 캐시를 삭제하여 문제를 해결했습니다 .

또는 간단히 실행할 수 있습니다.

npm cache clean --force

그런 다음 vscode를 닫은 다음 폴더를 다시 엽니 다.

나는 같은 문제에 직면하고 있었는데 두 가지 이유가있을 수 있습니다.

1. src 기본 폴더가 선언되지 않았을 수 있습니다.이 문제를 해결하려면 tsconfig.json으로 이동하여 기본 URL을 "src"로 추가하세요.

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "src",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

2. npm에 문제가있을 수 있습니다.이 문제를 해결하려면 명령 창을 열고 다음을 실행하십시오.npm install

이미 설치 한 모든 확장을 제거했는데 아래 주소에서 JavaScript 및 TypeScript IntelliSense 확장이 문제를 일으킨 것으로 나타났습니다. https://marketplace.visualstudio.com/items?itemName=sourcegraph.javascript-typescript

여기서 요점은 웹 사이트를 방문 할 때 노란색 레이블이 표시되어 미리보기 릴리스에 있음을 알려주지 만 확장 기능과 비교하면 해당 레이블이 표시되지 않는다는 것입니다.

나는 사람들이 여기서 알려주는 많은 것들을 시도했지만 성공하지 못했습니다. 그 후, 저는 VSCode 확장에 Deno Support를 사용하고 있다는 것을 깨달았습니다. 나는 그것을 제거하고 다시 시작해야했습니다. 다시 시작한 후 문제가 해결되었습니다.

수동으로 설치해야합니다.

$ npm i @angular/core -s

이 확장 https://marketplace.visualstudio.com/items?itemName=sourcegraph.javascript-typescript 로 인해 시각적 코드에서 오류가 발생하여 제거했으며 저에게 적합합니다.

제 경우에는 수입 라인의 철자 오류였습니다. 수동으로 입력하는 경우 @ angular / core 부분의 철자가 올바른지 확인하십시오.

import { Component } from '@angular/core';

나를위한 해결책은 전체 프로젝트를 가져 오는 것이 었습니다. 2019 년에이 문제가있는 분들은 프로젝트의 일부가 아닌 전체 프로젝트를 가져 왔는지 확인하시기 바랍니다.

내가 (어리석게도)했던 일을했다면 ... 구성 요소 폴더를 내 프로젝트 에 끌어다 놓는 것이 었으면 내가 한 일을 고쳐서 해결할 수있을 것입니다.

설명 : 기본적으로 Angualar CLI는 InteliJ에게@angular 의미를 합니다. Angular CLI 를 사용 하지 않고 프로젝트에서 파일을 플롭하면 즉 ng g componentName --module=app.module, Angular CLI는이 참조를 업데이트하는 것을 알지 못하므로 IntelliJ는 그것이 무엇인지 알지 못합니다.

접근 방식 : Angular CLI를 트리거하여 @angular. 나는 현재 이것을하는 한 가지 방법 만 알고 있습니다 ...

구현 : 문제가있는 구성 요소와 동일한 수준에 새 구성 요소 를 추가합니다 . ng g tempComponent --module=app.module 이렇게하면 Angular CLI가 프로젝트에서 이러한 참조를 실행하고 업데이트해야합니다. 이제 tempComponent를 삭제하십시오. 만든 를 에서 참조를 제거하는 것을 잊지 마십시오. .

이것이 다른 사람을 돕기를 바랍니다.

프로젝트가 오류없이 컴파일되고 실행 되었기 때문에 동일한 문제가 발생했습니다. npm을 업데이트 한 다음 패키지를 다시 설치했습니다.

npm update
npm install

그런 다음 대 코드는 그 말을 중지합니다.

프로젝트에 "nodes_modules"폴더를 포함하기 만하면됩니다. github throu git 명령 줄에서 프로젝트를 복제 할 때이 문제가 발생할 수 있습니다.

Visual Studio Code에서 기존 프로젝트를 복제하거나 열 때 발생합니다. 통합 터미널에서 npm install 명령을 실행하십시오.

이 문제를 다음과 같이 해결했습니다.

1. 프로젝트와 함께 Visual Studio 코드를 엽니 다.
2. 터미널-> 새 터미널.
3. 쓰기 npm install.

다음 두 명령을 실행하면 문제가 해결됩니다.

npm install -g @angular/cli
ng update --all --force

npm 패키지가 누락되었을 가능성이 높습니다. 그리고 때때로 npm 설치로 문제가 해결되지 않습니다.

나는 똑같은 문제에 직면했으며 node_modules폴더 를 삭제 한 다음 이 문제를 해결했습니다.npm install

Visual Studio의 경우->

    Seems like you don't have `node_modules` directory in your project folder.
     
    Execute this command where `package.json` file is located:
    
     npm install 

VSCode 상태 표시 줄에 다음과 같이 typescript 버전이 표시되어야합니다.

해당 버전 번호를 클릭하면 사용 가능한 다른 버전이 표시됩니다.

VSCode 버전을 사용하는 경우 작업 공간 버전으로 전환하면 tsconfig.json이 아닌 VScode 문제인 경우 문제가 해결 됩니다 (이미 사용하고 있으므로 강조 표시되지 않음).

이것을 시도해보십시오.

npm i --save @angular/platform-server  

그런 다음 VS 코드를 다시 엽니 다.

이것은 나를 위해 일했습니다.

 npm install --save-dev @angular-devkit/build-angular

제 경우에는 프로젝트를 각도 10으로 업그레이드 할 때이 오류가 발생했습니다.

각도 CLI는 생성 tsconfig.json, tsconfig.base.json그리고 tsconfig.app.json내가 삭제할 때 tsconfig.json 및 이름 변경 tsconfig.base.json 에 tsconfig.ts 모든 것을 좋아 것입니다. 당신은 또한 변화는 내부 확장해야한다 tsconfig.app.json 에 tsconfig.json을

Sublime Text와 동일한 문제가있었습니다.

나는 다음과 같은 해결책을 생각해 냈습니다. 방금 편집했습니다.

tsconfig.json

Angular 작업 공간의 루트에 새로 만든 응용 프로그램을 포함합니다.

 {
  "files": [],
  "references": [
    {
      "path": "./projects/client/tsconfig.app.json"
    },
    {
      "path": "./projects/client/tsconfig.spec.json"
    },
    {
      "path": "./projects/vehicle-market/tsconfig.app.json"
    },
    {
      "path": "./projects/vehicle-market/tsconfig.spec.json"
    },
    {
      "path": "./projects/mobile-de-lib/tsconfig.lib.json"
    },
    {
      "path": "./projects/mobile-de-lib/tsconfig.spec.json"
    }
  ]
    }

실행

npm install 

대부분의 경우 작동합니다.

내 관점에서 사용중인 CLI와 라이브러리가 일치하지 않습니다. ionic CLI 버전 1은 ionic CLI 버전 4에 대한 라이브러리를 빌드 할 수 없습니다. 가장 좋은 해결책은 CLI 버전을 업그레이드하는 것입니다. 그렇지 않으면 동일한 OS에서 여러 노드 버전을 실행할 수있는 nvm을 사용할 수 있습니다. 그러면 요구 사항에 따라 다른 프로젝트에서 다른 ionic CLI 버전을 사용할 수 있습니다.

nvm @ : 공식 창 저장소를 확인하십시오 . MAC 및 Linux 버전도 있습니다.