vs code cannot find module '@angular/core' or any other modules
Multi tool use
vs code cannot find module '@angular/core' or any other modules
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 vs code 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 vs code
it doesn't work.
here is my enviroment 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_module 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 :
{
"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"
]
}
}
angular core is in my node_module
– Arash
Aug 27 '17 at 9:31
Did you open a project in
vscode before you npm install? If yes have you try to restart vscode after that ?– Kuncevic
Aug 27 '17 at 11:50
vscode
npm install
yes
vscode
i have restarted 100 times
– Arash
Aug 27 '17 at 11:55
Can you try to generate a new project using cli,
npm install and then see if there is the same thing with that one?– Kuncevic
Aug 27 '17 at 12:11
npm install
6 Answers
6
I was facing this issue only while importing my own created components/services
For those of you like me, for whom the above 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.
tsconfig.json
Whereas angular compiler takes src as baseurl by default so it is able to compile.
src
EDIT:
You need to restart VS Code IDE to make this change come into effect.
this worked for me...but now getting another error Build: Class 'Subject<T>' incorrectly extends base class 'Observable<T>'
– sam
Mar 15 at 23:17
@sam that does not seem to be related to this issue. Maybe post it as a new question alongwith your code.
– catchingUp
Mar 16 at 3:28
This worked for me. I added src to basUrl in the tsconfig.app.json file. "baseUrl": "src",
– howserss
Mar 23 at 1:45
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.
Unfortunately I'm still having this issue, even after uninstalling all extensions and restarting VS Code. :/
– Jonathan
Oct 29 '17 at 19:05
@Jonathan , could you solve the issue?
– Arash
Nov 1 '17 at 7:57
Apologies, I should have given an update on this. Yes, it seems to have cleared up, but I'm not sure I recall exactly how. However, some things I definitely did do: A) completely deleted and re-created my solution, B) uninstalled and re-installed Angular CLI, C) rebooted my machine. Hope this might help someone. If it happens again, I'll try to be more methodical about determining how I fix it, so that I can report back a repeatable solution.
– Jonathan
Nov 1 '17 at 15:20
Another possible solution is to click on the status bar and select "Use Workspace Version", see github.com/Microsoft/vscode/issues/34681
– Luis Cantero
Jan 31 at 15:59
the fix for me was to run
npm install
and then unload,then reload the project in visual studio.
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 throu git command line.
probably not the case since when you run npm install on the root of your site in the folder that contains your package.json file, this folder is automatically created for you with the modules needed.
– Keenan Stewart
Apr 3 at 19:40
yah. if run nmp install then it will download necessary package by checking package.json file..
– Anand
Apr 5 at 6:48
Occurs when cloning or opening existing projects in Visual Studio Code.
In the integrated terminal run the command npm install
This was already given multiple times. Anything new you'd like to add?
– Nico Haase
Jun 25 at 11:14
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.
By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.
It's because you've installed angular core as global. Intellisense cannot find it in node_modules.
– Prajwal
Aug 27 '17 at 9:29