How to solve angular error "An unhandled exception occurred: Cannot find module 'typescript' "?

Question

I am getting these error while ng serve .

I have also tried below code. But getting same error

npm install -g typescript

Error in text form

D:\xampp\htdocs\angular\axen>ng serve
An unhandled exception occurred: Cannot find module 'typescript'
Require stack:
- D:\xampp\htdocs\angular\axen\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\models\architect-command.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\commands\serve-impl.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\export-ref.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\utilities\json-schema.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\models\command-runner.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
See "C:\Users\JIGNES~1\AppData\Local\Temp\ng-p0biUM\angular-errors.log" for further details.

D:\xampp\htdocs\angular\axen>npm install -g typescript
C:\Users\Jignesh-PC\AppData\Roaming\npm\tsserver -> C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\typescript\bin\tsserver
C:\Users\Jignesh-PC\AppData\Roaming\npm\tsc -> C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\typescript\bin\tsc
+ typescript@4.2.4
updated 1 package in 2.405s

D:\xampp\htdocs\angular\axen>ng serve
An unhandled exception occurred: Cannot find module 'typescript'
Require stack:
- D:\xampp\htdocs\angular\axen\node_modules\@angular-devkit\build-angular\src\dev-server\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\models\architect-command.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\commands\serve-impl.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\export-ref.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\utilities\json-schema.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\models\command-runner.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\lib\cli\index.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
- C:\Users\Jignesh-PC\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
See "C:\Users\JIGNES~1\AppData\Local\Temp\ng-dny752\angular-errors.log" for further details.

Here my package.json file

{
  "name": "axen",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular/animations": "^11.1.0",
    "@angular/cdk": "^11.1.0",
    "@angular/common": "^11.1.0",
    "@angular/compiler": "^11.1.0",
    "@angular/core": "^11.1.0",
    "@angular/forms": "^11.1.0",
    "@angular/localize": "^11.1.0",
    "@angular/material": "^11.1.0",
    "@angular/platform-browser": "^11.1.0",
    "@angular/platform-browser-dynamic": "^11.1.0",
    "@angular/router": "^11.1.0",
    "@ckeditor/ckeditor5-angular": "^2.0.1",
    "@ckeditor/ckeditor5-build-classic": "^24.0.0",
    "@fullcalendar/angular": "^5.5.0",
    "@fullcalendar/core": "^5.5.1",
    "@fullcalendar/daygrid": "^5.5.0",
    "@fullcalendar/interaction": "^5.5.0",
    "@fullcalendar/list": "^5.5.0",
    "@fullcalendar/timegrid": "^5.5.1",
    "@ng-bootstrap/ng-bootstrap": "^9.0.0",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "@swimlane/ngx-charts": "^17.0.0",
    "@swimlane/ngx-datatable": "^19.0.0",
    "@types/d3-shape": "^2.0.0",
    "acorn": "^8.0.4",
    "angular-gauge": "^4.0.0",
    "apexcharts": "^3.26.0",
    "bootstrap": "^4.6.0",
    "browser-sync": "^2.26.13",
    "chart.js": "^2.9.4",
    "core-js": "^3.8.3",
    "echarts": "^4.9.0",
    "mat-progress-buttons": "^9.2.1",
    "moment": "^2.29.1",
    "ng-apexcharts": "^1.5.6",
    "ng-click-outside": "^7.0.1",
    "ng-image-fullscreen-view": "^2.0.0",
    "ng-pick-datetime": "^7.0.0",
    "ng2-charts": "^2.4.2",
    "ng2-dragula": "^2.1.1",
    "ngx-color-picker": "^11.0.0",
    "ngx-custom-validators": "^11.0.1",
    "ngx-dropzone-wrapper": "^10.0.1",
    "ngx-echarts": "^5.1.2",
    "ngx-gauge": "^1.1.0",
    "ngx-mask": "^11.1.4",
    "ngx-material-file-input": "^2.1.1",
    "ngx-perfect-scrollbar": "^10.1.0",
    "ngx-spinner": "^10.0.1",
    "rxjs": "^6.6.3",
    "sweetalert2": "^10.13.0",
    "tslib": "^2.1.0",
    "zone.js": "~0.11.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.1101.4",
    "@angular/cli": "^11.1.0",
    "@angular/compiler-cli": "^11.1.0",
    "@angular/language-service": "^11.1.0",
    "@types/jasmine": "~3.6.3",
    "@types/jasminewd2": "~2.0.8",
    "@types/node": "^14.14.22",
    "codelyzer": "^6.0.1",
    "del": "^6.0.0",
    "install": "^0.13.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~6.0.0",
    "karma": "~6.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.3",
    "karma-jasmine": "~4.0.1",
    "karma-jasmine-html-reporter": "^1.5.4",
    "protractor": "~7.0.0",
    "run-sequence": "^2.2.1",
    "ts-node": "~9.1.1",
    "tslint": "~6.1.3",
    "typescript": "~4.0.2"
  }
}

Answer 1

Try to delete typescript folder from your node_modules and reinstall it by "npm install typescript" command. Still it does not work then try to link it by command "npm link typescript"

Answer 2

Same answer by @Devang Patel. Difference is you have to install it in globally and then you may have to set installed path in environment variables.

Try this,

1.Delete the typescript folder in node_modules.

2. npm install -g typescript and npm link typescript

If this is not working, uninstall angular-cli globally, run npm cache clean and reinstall cli. Then repeat the same steps(1 and 2) again.