VSCode ne trouve pas le module '@angular/core' ou tout autre module.

Question

Mon projet a été généré avec Angular CLI version 1.2.6.

Je peux compiler le projet et il fonctionne bien, mais je reçois toujours une erreur dans VSCode me disant :

cannot  find module '@angular/core'
cannot find module '@angular/router'
cannot find module .....

J'ai joint le contenu de mon tsconfig.json fichier Cela a été très frustrant pour moi, j'ai passé deux heures à chercher ce qui ne va pas, J'ai également désinstallé et réinstallé le VSCode. cela ne fonctionne pas.

Voici les spécifications de mon environnement :

@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 vs 10 enterprise

dossier racine du projet

.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_modules dossier

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

Answer 1

J'ai été confronté à ce problème uniquement lors de l'importation de mes propres composants/services créés. Pour ceux d'entre vous comme moi, pour qui la solution acceptée n'a pas fonctionné, vous pouvez essayer ceci :

Ajouter

"baseUrl": "src"

dans votre tsconfig.json . La raison est que visual code IDE est incapable de résoudre l'url de base et donc est incapable de résoudre le chemin vers les composants importés et donne une erreur / avertissement.

Alors que le compilateur angulaire prend src comme baseurl par défaut afin qu'il puisse être compilé.

NOTE :

Vous devez redémarrer l'IDE VS Code pour que ce changement prenne effet.

EDIT :

Comme mentionné dans l'un des commentaires, dans certains cas, changer la version de l'espace de travail peut également fonctionner. Plus de détails ici : https://github.com/Microsoft/vscode/issues/34681#issuecomment-331306869

Answer 2

Très probablement absent node_modules dans le projet angulaire, exécutez :

npm install

dans le dossier du projet angulaire.

Answer 3

Le redémarrage de Visual Code est nécessaire en cas de mise à jour, d'installation ou de suppression du cache.

Answer 4

la solution pour moi était d'exécuter

npm install

et ensuite décharger, puis recharger le projet dans le studio visuel.

Answer 5

Essayez d'utiliser :

npm audit fix --force

et ensuite :

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

au lieu d'économiser @ng-bootstrap/ng-bootstrap globalement.