Angular 17: Cannot find type definition file for 'node'

Question

I'm trying to upgrade my Angular app from V16 to V17. V17 requires Typescript 5.2 or later. When I run ng serve, I get the following errors:

Error: error TS2688: Cannot find type definition file for 'jquery'.
  The file is in the program because:
    Entry point of type library 'jquery' specified in compilerOptions


Error: error TS2688: Cannot find type definition file for 'node'.
  The file is in the program because:
    Entry point of type library 'node' specified in compilerOptions

Tried everything I saw around with no success for now.

My tsconfig file includes:

{
    "compileOnSave": false,
    "compilerOptions": {
        "baseUrl": "./",
        "resolveJsonModule": true,
        "allowSyntheticDefaultImports": true,
        "paths": {
            "@env": ["src/environments/environment.ts"]
        },
        "outDir": "./dist/out-tsc",
        "forceConsistentCasingInFileNames": true,
        "strict": true,
        "noImplicitReturns": true,
        "noFallthroughCasesInSwitch": true,
        "sourceMap": true,
        "declaration": false,
        "downlevelIteration": true,
        "experimentalDecorators": true,
        "moduleResolution": "node",
        "importHelpers": true,
        "target": "ES2022",
        "module": "es2022",
        "lib": ["es2022", "dom"],
        "types": ["node", "jquery"],
        "typeRoots": ["node_modules/@types"],
        "useDefineForClassFields": false
    },
    "angularCompilerOptions": {
        "enableI18nLegacyMessageIdFormat": false,
        "strictInjectionParameters": true,
        "strictInputAccessModifiers": true,
        "strictTemplates": true,
        "fullTemplateTypeCheck": true
    }
}

My package.json:

{
  "name": "myApp",
  "version": "5.4.3",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
    "pretty-quick": "pretty-quick --staged",
    "prepare": "husky install"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^17.0.8",
    "@angular/cdk": "^17.0.4",
    "@angular/common": "^17.0.8",
    "@angular/compiler": "^17.0.8",
    "@angular/core": "^17.0.8",
    "@angular/forms": "^17.0.8",
    "@angular/material": "^16.2.0",
    "@angular/platform-browser": "^17.0.8",
    "@angular/platform-browser-dynamic": "^17.0.8",
    "@angular/router": "^17.0.8",
    "@angular/service-worker": "^17.0.8",
    "@mapbox/mapbox-gl-language": "^0.9.2",
    "@ng-idle/core": "^14.0.0",
    "@ngrx/effects": "^15.1.0",
    "@ngrx/store": "^15.1.0",
    "@ngrx/store-devtools": "^15.1.0",
    "@ngu/carousel": "7.0.0",
    "@ngx-translate/core": "^15.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "@paypal/paypal-js": "^5.0.3",
    "@sentry/angular-ivy": "^7.54.0",
    "@turf/boolean-point-in-polygon": "^6.5.0",
    "@turf/distance": "^5.1.5",
    "angularx-qrcode": "^14.0.0",
    "chart.js": "^4.4.1",
    "date-fns": "^2.30.0",
    "debug": "^3.1.0",
    "file-saver": "^2.0.2",
    "hammerjs": "^2.0.8",
    "jquery": "^3.5.1",
    "keen-slider": "^6.8.6",
    "lodash.isplainobject": "^4.0.6",
    "mapbox-gl": "^0.53.1",
    "moment": "^2.27.0",
    "ng2-charts": "^5.0.4",
    "ngx-audio-player": "^12.0.2",
    "ngx-cookie-service": "^15.0.0",
    "ngx-image-cropper": "^7.1.2",
    "ngx-infinite-scroll": "^16.0.0",
    "ngx-quicklink": "^0.4.4",
    "ngx-slider-v2": "^17.0.0",
    "quill": "^1.3.3",
    "redux": "4.0.1",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "^3.0.6",
    "rxjs": "^7.8.0",
    "shufflejs": "^6.1.0",
    "simplify-ts": "^1.0.1",
    "socket.io": "^2.2.0",
    "tslib": "^2.0.0",
    "video.js": "^7.11.4",
    "webpack-bundle-analyzer": "^4.4.0",
    "zone.js": "~0.14.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.0.8",
    "@angular-eslint/builder": "^17.1.1",
    "@angular-eslint/eslint-plugin": "^17.1.1",
    "@angular-eslint/eslint-plugin-template": "^17.1.1",
    "@angular-eslint/schematics": "^17.1.1",
    "@angular-eslint/template-parser": "^17.1.1",
    "@angular/cli": "^17.0.8",
    "@angular/compiler-cli": "^17.0.8",
    "@types/debug": "^4.1.7",
    "@types/file-saver": "^2.0.5",
    "@types/jasmine": "~3.6.0",
    "@types/jquery": "^3.5.5",
    "@types/lodash": "^4.14.182",
    "@types/mapbox-gl": "^0.44.0",
    "@types/moment": "^2.13.0",
    "@types/node": "^20.10.5",
    "@types/socket.io-client": "^1.4.31",
    "@types/video.js": "^7.3.15",
    "@typescript-eslint/eslint-plugin": "^6.10.0",
    "@typescript-eslint/parser": "^6.10.0",
    "cachefactory": "^3.0.0",
    "codelyzer": "^6.0.0",
    "eslint": "^8.53.0",
    "eslint-plugin-import": "^2.26.0",
    "eslint-plugin-jsdoc": "30.7.6",
    "eslint-plugin-prefer-arrow": "1.2.2",
    "husky": "^8.0.2",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "prettier": "^2.8.1",
    "pretty-quick": "^3.1.3",
    "protractor": "~7.0.0",
    "ts-node": "~10.9.2",
    "typescript": "~5.2.2"
  }
}

Thanks!

Answer 1

I am using monorepo. I thought the problem was because it was Monorepo. There is nothing I haven't tried like you. When I opened the tsconfig.ts file and removed the types array, I saw that it worked without any problems. I tested it by building. I did not see any problems in the development environment.

"types": [
    "node"
],

Just remove the part I showed and try it.

Answer 2

I searched for "jquery" in my project, then i found it in

tsconfig.app.json

I removed

"types": ["jquery"]

Then recompile your project