vs code kann das Modul '@ angle / core' oder andere Module nicht finden

Mein Projekt wurde mit [Angular CLI] Version 1.2.6 erstellt.

Ich kann das Projekt kompilieren und es funktioniert einwandfrei, aber ich erhalte immer eine Fehlermeldung im vs-Code, die besagt, dass ich das Modul '@ angle / core' nicht finden kann. Das Modul '@ angle / router' kann das Modul nicht finden .....

Ich habe den Inhalt meiner Datei tsconfig.json angehängt. Dies war wirklich frustrierend für mich. Ich habe 2 Stunden damit verbracht, herauszufinden, was falsch ist. Außerdem habe ich den vs-Code deinstalliert und neu installiert, der nicht funktioniert.

Hier ist meine Umweltspezifikation:

@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

Betriebssystem: Microsoft vs 10 Enterprise

Projektstammordner

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

Ordner 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"
    ]
  }
}

Ich hatte dieses Problem nur beim Importieren meiner selbst erstellten Komponenten / Services. Für diejenigen unter Ihnen wie mich, für die die akzeptierte Lösung nicht funktioniert hat, ist Folgendes möglich:

Hinzufügen

"baseUrl": "src"

in deinem tsconfig.json. Der Grund dafür ist, dass die visuelle Code-IDE die Basis-URL nicht auflösen kann, daher den Pfad zu importierten Komponenten nicht auflösen kann und Fehler / Warnungen ausgibt.

Während srcAngular Compiler standardmäßig als Baseurl verwendet wird, kann er kompiliert werden.

HINWEIS:

Sie müssen VS Code IDE neu starten, damit diese Änderung wirksam wird.

BEARBEITEN:

Wie in einem der Kommentare erwähnt, kann es in einigen Fällen auch funktionieren, die Version des Arbeitsbereichs zu ändern. Weitere Details finden Sie hier: https://github.com/Microsoft/vscode/issues/34681#issuecomment-331306869

Am wahrscheinlichsten fehlt das Paket node_modules im Winkelprojekt. Führen Sie Folgendes aus:

npm install

im eckigen Projektordner.

Ein Neustart des visuellen Codes ist erforderlich, wenn ein Cache aktualisiert, installiert oder gelöscht wird

Die Lösung für mich war zu rennen

npm install

und dann entladen, dann das Projekt in Visual Studio neu laden.

Ich war angular 5heute in meiner Bewerbung mit diesem Problem konfrontiert . Und die Lösung, die mir geholfen hat, war einfach. Ich "moduleResolution": "node"habe compilerOptionsin der tsconfig.jsonDatei hinzugefügt . Mein vollständiger tsconfig.jsonDateiinhalt ist unten.

{
  "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"
    ]
  }
}

Die moduleResolutionspezifizierte Modulauflösungsstrategie. Der Wert dieser Einstellungen kann nodeoder sein classic. Sie können mehr über das lesen hier .

Versuchen Sie es mit:

npm audit fix --force

und dann:

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

anstatt @ng-bootstrap/ng-bootstrapglobal zu sparen .

Ich hatte das gleiche Problem. Ich habe es behoben, indem ich den npm-Cache gelöscht habe, der sich unter "C: \ Benutzer \ Administrator \ AppData \ Roaming \ npm-Cache" befindet.

Oder Sie können einfach ausführen:

npm cache clean --force

Schließen Sie dann vscode und öffnen Sie Ihren Ordner erneut.

Löschen Sie den Ordner "Knotenmodule" aus dem Projektordner. Führen Sie den folgenden Befehl aus

npm cache clean --force npm install

Es sollte funktionieren.

Ich habe alle Erweiterungen deinstalliert, die ich bereits installiert hatte, und es stellte sich heraus, dass die JavaScript- und TypeScript IntelliSense-Erweiterung von der unten angegebenen Adresse das Problem verursacht hat. https://marketplace.visualstudio.com/items?itemName=sourcegraph.javascript-typescript

Der Punkt hier ist, wenn Sie die Website besuchen, auf der sich ein gelbes Etikett befindet, das angibt, dass es sich um eine Vorschau-Version handelt. Wenn Sie jedoch in vs-Erweiterungen navigieren, wird dieses Etikett nicht angezeigt.

Ich habe viele Sachen ausprobiert, die die Jungs hier informiert haben, ohne Erfolg. Danach wurde mir gerade klar, dass ich die Deno Support for VSCode-Erweiterung verwende. Ich habe es deinstalliert und ein Neustart war erforderlich. Nach dem Neustart wurde das Problem behoben.

Diese Erweiterung https://marketplace.visualstudio.com/items?itemName=sourcegraph.javascript-typescript hat mir den Fehler im visuellen Code verursacht. Ich habe ihn deinstalliert und er funktioniert für mich

In meinem Fall war es eine falsche Schreibweise der Importlinie. Überprüfen Sie, ob Sie das @ Winkel- / Kernteil richtig geschrieben haben, wenn Sie es manuell eingeben.

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

Die Lösung für mich war, das gesamte Projekt zu importieren. Für diejenigen, die dieses Problem im Jahr 2019 haben, überprüfen Sie bitte, ob Sie das gesamte Projekt importiert haben, das nicht Teil des Projekts ist.

Wenn Sie das getan haben, was ich (dummerweise) getan habe ... Das war das Ziehen und Ablegen eines Komponentenordners in mein Projekt, dann können Sie es wahrscheinlich lösen, indem Sie das tun, was ich getan habe, um es zu beheben.

Erläuterung : Grundsätzlich muss Angualar CLI InteliJ auf irgendeine Weise mitteilen, was dies @angularbedeutet. Wenn Sie nur die Datei in Ihr Projekt ohne plopieren die Angular CLI zu verwenden, dh ng g componentName --module=app.moduleAngular CLI weiß nicht, wie diese Referenz aktualisiert werden soll, sodass IntelliJ keine Ahnung hat, um was es sich handelt.

Ansatz : Lösen Sie die Angular CLI aus, um die Referenzen von zu aktualisieren @angular. Ich kenne derzeit nur einen Weg, dies zu tun ...

Implementierung : Fügen Sie eine neue Komponente auf derselben Ebene hinzu wie die Komponente, mit der Sie Probleme haben. ng g tempComponent --module=app.module Dies sollte die Angular CLI zwingen, diese Referenzen im Projekt auszuführen und zu aktualisieren. Löschen Sie jetzt einfach die tempComponent Sie soeben erstellte und vergessen Sie nicht , einen Verweis darauf in app.module zu entfernen .

Hoffe das hilft jemand anderem.

Ich hatte das gleiche Problem, war seltsam, weil das Projekt ohne Fehler kompiliert und ausgeführt wurde. Ich habe npm aktualisiert und dann die Pakete neu installiert

npm update
npm install

dann hör auf, Code zu sagen.

Sie müssen es manuell installieren.

$ npm i @angular/core -s

Ich hatte das gleiche Problem, es könnte zwei Gründe dafür geben:

1. Ihr src-Basisordner wurde möglicherweise nicht deklariert. Um dies zu beheben, gehen Sie zu tsconfig.json und fügen Sie die Basis-URL als "src" hinzu.

{
  "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. Möglicherweise haben Sie ein Problem mit npm. Um dieses Problem zu beheben, öffnen Sie das Befehlsfenster und führen Sie Folgendes aus:npm install

Alles, was Sie tun müssen, ist, dass Sie den Ordner "node_modules" in Ihr Projekt aufnehmen müssen. Dieses Problem kann auftreten, wenn Sie ein Projekt über die gitub-Befehlszeile klonen.

Tritt auf, wenn vorhandene Projekte in Visual Studio Code geklont oder geöffnet werden. Führen Sie im integrierten Terminal den Befehl npm install aus

Ich habe dieses Problem wie folgt gelöst:

1. Öffnen Sie Visual Studio-Code mit Ihrem Projekt.
2. Terminal -> Neues Terminal.
3. Schreiben Sie npm install.

Das Ausführen der folgenden zwei Befehle löst das Problem für mich:

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

Höchstwahrscheinlich fehlt das npm-Paket. Und manchmal behebt die npm-Installation das Problem nicht.

Ich habe das gleiche Problem und ich habe dieses Problem gelöst, indem ich den node_modulesOrdner gelöscht habe und dannnpm install

für 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 

In der VSCode-Statusleiste muss die Typoskriptversion angezeigt werden - so

Wenn Sie auf diese Versionsnummer klicken, werden Ihnen verschiedene Versionen angezeigt.

Wenn Sie die VSCode-Version verwenden , löst das Wechseln zur Workspace-Version das Problem, wenn es sich eher um ein VScode-Problem als um Ihre tsconfig.json handelt (ich verwende diese bereits, daher nicht hervorgehoben).

Konnte das gleiche Problem. Ich habe den Visual Code Editor neu gestartet und mein Problem behoben.

Lauf doch

npm install 

es wird in den meisten Fällen funktionieren

Ich habe mich ein paar Stunden mit diesem Problem beschäftigt. Ich habe lediglich VS Code neu gestartet und das Problem ist behoben.

Aus meiner Sicht stimmen die von Ihnen verwendete CLI und die Bibliotheken nicht überein. Die ionische CLI-Version 1 kann keine Bibliotheken für die ionische CLI-Version 4 erstellen. Die beste Lösung besteht darin, ein Upgrade Ihrer CLI-Version durchzuführen. Sie können auch nvm verwenden, mit dem Sie mehrere Knotenversionen auf demselben Betriebssystem ausführen können. Dies kann Ihnen helfen, je nach den Anforderungen unterschiedliche ionische CLI-Versionen in verschiedenen Projekten zu verwenden.

Check out nvm @: Ihr offizielles Windows-Repo. Es gibt auch eine MAC- und Linux-Version.

Wenn diese Art von Fehler auftritt, verwenden Sie einfach den folgenden Befehl:

 npm i @anglar/core,
 npm i @angular/common,
 npm i @angular/http,
 npm i @angular/router

Nach der Installation dieses ebenfalls angezeigten Fehlers entfernen Sie einfach einige Wörter und fügen Sie das Wort erneut hinzu.