VSCode cannot find module angular core or any other modules

Question

My project was generated with Angular CLI version 1 2 6  I can compile the project and it works fine  but I always get error in VSCode telling me   cannot  find module   angular core  cannot find module   angular router  cannot find module           I have attached  content of my tsconfig json file this has been  really frustrating for me  spending 2 hours to figure out what is wrong  I have also uninstalled and reinstalled the VSCode it doesn t work  Here is my environment specification   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 project root folder  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 folder - 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       quot compileOnSave quot   false     quot compilerOptions quot          quot outDir quot    quot   dist out-tsc quot        quot sourceMap quot   true       quot declaration quot   false       quot moduleResolution quot    quot node quot        quot emitDecoratorMetadata quot   true       quot experimentalDecorators quot   true       quot target quot    quot es5 quot        quot typeRoots quot            quot node modules  types quot              quot lib quot            quot es2016 quot          quot dom quot

User · Answer

From my point of view the CLI you are using and the libraries are mismatched. The ionic CLI version 1 cannot build libraries for ionic CLI version 4. The best solution is to try upgrade your CLI version. You can otherwise use nvm which allows you to run multiple node versions on the same O.S. This can help you use different ionic CLI versions across different projects depending on the requirements.

Check out nvm @: Their official windows repo. There is also a MAC and Linux version.

User · Answer

Do run  npm install    it will work most of the cases

User · Answer

In my case  when i upgrade vs project to angular 10  I had this errors  Angular cli creates tsconfig json  tsconfig base json and tsconfig app json when i delete tsconfig json and rename tsconfig base json to tsconfig ts all things will Ok  you must also change extends inside tsconfig app json to tsconfig json

User · Answer

You need to install it manually    npm i  angular core -s

User · Answer

the fix for me was to run   npm install   and then unload then reload the project in visual studio

User · Answer

I had the same problem  I resolved it by clearing npm cache which is at  C  Users Administrator AppData Roaming npm-cache   Or you can simply run   npm cache clean --force   and then close vscode  and then open your folder again

User · Answer

This worked for me   npm install --save-dev  angular-devkit build-angular

User · Answer

The fix for me was to import the entire project  For those who have this problem in 2019 please check if you have imported the entire project not a part of the project

User · Answer

Most likely missing node modules package in the angular project  run  npm install  inside the angular project folder

User · Answer

Occurs when cloning or opening existing projects in Visual Studio Code  In the integrated terminal run the command  npm install

User · Answer

for Visual Studio -- gt      Seems like you don t have  node modules  directory in your project folder            Execute this command where  package json  file is located            npm install

User · Answer

If you did what I  foolishly  did    Which was drag and drop a component folder into my project then you ll probably be able to solve it by doing what I did to fix it   Explanation  Basically  by some means Angualar CLI must tell InteliJ what  angular means  If you just plop the file in your project without using the Angular CLI i e  ng g componentName --module app module then Angular CLI doesn t know to update this reference so IntelliJ has no idea what it is   Approach  Trigger the Angular CLI to update references of  angular  I currently know only one way to do this     Implementation  Add a new component at the same level as the component your having issues with  ng g tempComponent --module app module This should force the Angular CLI to run and update these references in the project  Now just delete the tempComponent you just created and don t forget to remove any reference to it in app module   Hope this helps someone else out

User · Answer

I was facing this issue in my angular 5 application today  And the fix which helped me  was simple  I added  moduleResolution    node  to the compilerOptions in the tsconfig json file  My complete tsconfig json file content is below         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                The moduleResolution specify module resolution strategy  The value of this settings can be node or classic  You may read more about this here

User · Answer

Delete Node Modules folder from project folder Run below command  npm cache clean --force npm install  It should work

User · Answer

I had same problems with Sublime Text  I came up with following solution  I just edited  tsconfig json  in the root of Angular workspace to include my freshly created application        quot files quot          quot references quot                  quot path quot    quot   projects client tsconfig app json quot                      quot path quot    quot   projects client tsconfig spec json quot                      quot path quot    quot   projects vehicle-market tsconfig app json quot                      quot path quot    quot   projects vehicle-market tsconfig spec json quot                      quot path quot    quot   projects mobile-de-lib tsconfig lib json quot                      quot path quot    quot   projects mobile-de-lib tsconfig spec json quot

User · Answer

Try this  it worked for me  npm i --save  angular platform-server    Then reopen VS code

User · Answer

If we get this type of error just use the command    npm i  anglar core   npm i  angular common   npm i  angular http   npm i  angular router   After installing this also showing error just remove few words then again add that word its working

User · Answer

I was facing this issue only while importing my own created components services For those of you like me  for whom the accepted solution did not work  can try this   Add   baseUrl    src    in your tsconfig json  The reason is that visual code IDE is unable to resolve the base url so is unable to resolve path to imported components and gives error warning   Whereas angular compiler takes src as baseurl by default so it is able to compile   NOTE   You need to restart VS Code IDE to make this change come into effect   EDIT   As mentioned in one of the comments  in some cases changing workspace version might also work  More details here  https   github com Microsoft vscode issues 34681 issuecomment-331306869

User · Answer

I solved this problem as follow    Open Visual studio code with your project  Terminal -  New Terminal  Write npm install

User · Answer

Try using   npm audit fix --force   and then   npm install --save  ng-bootstrap ng-bootstrap   instead of saving  ng-bootstrap ng-bootstrap globally

User · Answer

In the VSCode status bar  it must be showing typescript version - like this  Clicking on that version number will show you this  different versions available   If you are using the VSCode version then switching to Workspace version solves the problem if it is VScode issue rather than your tsconfig json  I am already using that one  so not highlighted

User · Answer

I was facing the same issue   there could be two reasons for this-  Your src base folder might not been declared  to resolve this go to tsconfig json and add the baseUrl as  quot src quot        quot compileOnSave quot   false     quot compilerOptions quot          quot baseUrl quot    quot src quot        quot outDir quot    quot   dist out-tsc quot        quot sourceMap quot   true       quot declaration quot   false       quot downlevelIteration quot   true       quot experimentalDecorators quot   true       quot module quot    quot esnext quot        quot moduleResolution quot    quot node quot        quot importHelpers quot   true       quot target quot    quot es2015 quot        quot lib quot            quot es2018 quot          quot dom quot                quot angularCompilerOptions quot          quot fullTemplateTypeCheck quot   true       quot strictInjectionParameters quot   true         you might have problem in npm   To resolve this   open your command window and run-npm install

User · Answer

I faced the same problem   As I m trying to work on angular project in VS code  The solution for which this issue resolved is    Delete the node modules folder if you have one in your project folder  2 run the following command in terminal npm install  Then Run npm audit fix  Then Run npm audit fix --force   now the issue will be resolved

User · Answer

I had the same issue  was strange because project compiled and ran without errors  I updated npm and then reinstalled the packages  npm update npm install   then vs code stop saying that

User · Answer

All you need to do is that you have to include nodes modules folder in your project  You might face this problem when you clone any project from github through git command line

User · Answer

Visual Code restart is needed if any update or install or clear cache

User · Answer

In my case it was a mispelling of the import line  Check that you have spelt the  angular core part properly if typing it out manually   x000D   x000D  import   Component   from   angular core   x000D   x000D   x000D

User · Answer

Most likely npm package is missing  And sometimes npm install does not fix the problem  I have faced the same and I have solved this issue by deleting the node modules folder and then npm install

User · Answer

I tried a lot of stuff the guys informed here  without success  After  I just realized I was using the Deno Support for VSCode extension  I uninstalled it and a restart was required  After restart the problem was solved

User · Answer

I uninstalled all extension I had already installed  and it turns out JavaScript and TypeScript IntelliSense extension from below address caused the issue  https   marketplace visualstudio com items itemName sourcegraph javascript-typescript  the point here is when you visit the website you see there is a yellow label  telling you it is in preview release  but when you browse in vs extensions  you don t see that label

User · Answer

Executing the following two commands solves the problem for me   npm install -g  angular cli ng update --all --force

User · Answer

this extension https   marketplace visualstudio com items itemName sourcegraph javascript-typescript was causing me the error in visual code  I uninstalled it and it works for me

[angular] VSCode cannot find module '@angular/core' or any other modules

Examples related to angular

Examples related to visual-studio-code