Error: TypeError: Cannot read properties of undefined (reading 'kind')

🔎 Search Terms

Hi, I have an angular application that was running perfectly fine but recently started giving an error in heroku deployment. No matter what I try, I continue to get the same error. Although the application runs and builds fine in my local environment, it fails when deployed to heroku.

The error I get is:
- Generating browser application bundles... ✔ Browser application bundle generation complete. Error: TypeError: Cannot read properties of undefined (reading 'kind') at /tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:2580:166 at assert (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:2501:127) at Object.assertNode (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:2580:17) at visitNode (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80360:18) at Object.visitEachChild (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80766:124) at visitor (/tmp/build_27a77d7c/node_modules/@ngtools/webpack/src/transformers/make_transform.js:60:31) at visitNode (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80346:23) at Object.visitEachChild (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80764:172) at visitor (/tmp/build_27a77d7c/node_modules/@ngtools/webpack/src/transformers/make_transform.js:60:31) at visitNodes (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80399:48) at visitLexicalEnvironment (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80439:22) at Object.visitEachChild (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80826:55) at visitor (/tmp/build_27a77d7c/node_modules/@ngtools/webpack/src/transformers/make_transform.js:60:31) at Object.visitNode (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:80346:23) at transformer (/tmp/build_27a77d7c/node_modules/@ngtools/webpack/src/transformers/make_transform.js:67:31) at transformSourceFileOrBundle (/tmp/build_27a77d7c/node_modules/typescript/lib/typescript.js:81505:57) -----> Build failed

I have tried changing the version of typescript, adding compile options in tsconfig.json to ignore typescript version check but still run into the same issue.

My package.json is:
{ "name": "app", "version": "2.0.0", "browser": { "fs": false, "path": false, "os": false }, "scripts": { "ng": "ng", "main": "server.js", "heroku-postbuild": "ng build app --aot --configuration=${ENV}", "preinstall": "npm install --location=global @angular/cli @angular/compiler-cli --legacy-peer-deps", "start": "ng serve", "build": "ng build --prod", "cypress:open": "cypress open", "swagger": "node ./swagger.js", "cypress:run": "cypress run", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular-devkit/build-angular": "^12.2.18", "@angular/animations": "^12.2.17", "@angular/cdk": "^12.2.13", "@angular/cli": "^12.2.18", "@angular/common": "^12.2.17", "@angular/compiler": "^12.2.17", "@angular/compiler-cli": "^12.2.17", "@angular/core": "^12.2.17", "@angular/flex-layout": "^12.0.0-beta.34", "@angular/forms": "^12.2.17", "@angular/language-service": "^12.2.17", "@angular/localize": "^12.2.17", "@angular/material": "^12.2.13", "@angular/platform-browser": "^12.2.17", "@angular/platform-browser-dynamic": "^12.2.17", "@angular/router": "^12.2.17", "@capacitor/android": "^5.7.0", "@capacitor/app": "5.0.7", "@capacitor/core": "^5.7.0", "@capacitor/dialog": "^5.0.7", "@capacitor/haptics": "5.0.7", "@capacitor/ios": "5.7.0", "@capacitor/keyboard": "5.0.8", "@capacitor/preferences": "^5.0.7", "@capacitor/status-bar": "5.0.7", "@capgo/capacitor-updater": "^5.9.0", "@ng-bootstrap/ng-bootstrap": "9.0.2", "@ngtools/webpack": "^12.2.18", "@ngx-translate/core": "13.0.0", "@ngx-translate/http-loader": "^4.0.0", "@types/chart.js": "^2.7.42", "@types/chartist": "^0.9.38", "@types/crypto-js": "^3.1.47", "@types/express": "^4.17.0", "@types/googlemaps": "^3.43.3", "@types/jasmine": "~2.8.22", "@types/jasminewd2": "~2.0.3", "@types/lodash": "4.14.135", "@types/node": "^11.15.54", "@types/socket.io": "^3.0.2", "@types/socket.io-client": "^3.0.0", "@types/uuid": "^8.3.0", "@types/w3c-web-usb": "^1.0.10", "@types/web-bluetooth": "0.0.4", "angular-bootstrap-md": "^11.1.0", "angular-cc-library": "^2.1.2", "angular-cli-ghpages": "^0.6.2", "angular-notifier": "^9.1.0", "angular-responsive-carousel": "^2.0.2", "angularx-qrcode": "^12", "apexcharts": "^3.44.0", "axios": "^1.6.1", "bcryptjs": "^2.4.3", "body-parser": "^1.18.3", "bootstrap": "^4.5.3", "chart.js": "^2.9.4", "chartist": "^0.11.4", "clover-ecomm-sdk": "^1.0.0", "config": "^3.3.6", "core-js": "^2.5.4", "cors": "^2.8.5", "cron": "^3.1.6", "crypto": "^1.0.1", "crypto-js": "^4.2.0", "dotenv": "^6.1.0", "exec": "^0.2.1", "express": "^4.18.1", "express-jwt": "^8.4.1", "express-subdomain": "^1.0.6", "font-awesome": "^4.7.0", "fontawesome": "^5.6.3", "fs": "^0.0.1-security", "googlemaps": "^1.12.0", "got": "^11.8.1", "hammerjs": "^2.0.8", "jsonwebtoken": "^9.0.2", "jwt-decode": "^3.1.2", "lodash": "^4.17.21", "luxon": "^3.4.4", "lz-string": "^1.5.0", "material-dashboard": "^2.1.0", "material-design-icons": "^3.0.1", "material-design-lite": "^1.3.0", "mdbootstrap": "^4.19.2", "moment": "^2.30.1", "mongodb": "^3.0.10", "mongoose": "^5.11.15", "mongoose-to-swagger": "^1.5.1", "ng-apexcharts": "1.5.12", "ng-chartist": "^4.1.0", "ng-image-slider": "^3.0.1", "ng-multiselect-dropdown": "^0.2.14", "ng-otp-input": "1.8.1", "ng-socket-io": "^0.2.4", "ngx-autosize": "^1.8.4", "ngx-bootstrap": "^6.2.0", "ngx-device-detector": "^2.0.0", "ngx-google-places-autocomplete": "^2.0.5", "ngx-guided-tour": "^1.1.11", "ngx-infinite-scroll": "^10.0.0", "ngx-material-timepicker": "5.6.0", "ngx-swiper-wrapper": "^10.0.0", "ngx-toastr": "13.2.1", "ngx-virtual-scroller": "^4.0.3", "openai": "^4.17.4", "path": "^0.12.7", "popper.js": "^1.15.0", "postcss": "^8.4.14", "request-promise": "^4.2.4", "resize-base64": "^1.0.12", "rootpath": "^0.1.2", "rxjs": "^6.5.2", "rxjs-compat": "^6.3.3", "simple-keyboard": "^3.7.65", "socket.io": "^4.6.2", "socket.io-client": "^4.6.2", "swagger-ui-express": "^5.0.0", "telnyx": "^1.26.0", "time-ago-pipe": "^1.3.2", "ts-node": "6.0.0", "tslib": "^1.9.0", "uuid": "^3.3.2", "web-animations-js": "^2.3.2", "zone.js": "~0.11.8" }, "devDependencies": { "@angular-devkit/core": "^12.2.18", "@angular-devkit/schematics": "^12.2.18", "@capacitor/cli": "^5.7.0", "codelyzer": "^6.0.2", "cypress": "^13.5.0", "cypress-cucumber-preprocessor": "^4.3.1", "cypress-multi-reporters": "^1.6.0", "eslint-plugin-cypress": "^2.10.3", "jasmine-core": "~2.99.1", "jasmine-spec-reporter": "~4.2.1", "karma": "^6.4.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.0", "karma-jasmine": "~1.1.1", "karma-jasmine-html-reporter": "^0.2.2", "ng2-charts-schematics": "^0.1.7", "protractor": "^7.0.0", "swagger-autogen": "^2.23.7", "swiper": "^6.8.4", "tslint": "6.1.3", "typescript": "^4.2.3" }, "engines": { "node": "18.18.2", "npm": "9.8.0" } }

I did not update the version or anything

🕗 Version & Regression Information

• This changed between versions ______ and _______
• This changed in commit or PR _______
• This is the behavior in every version I tried, and I reviewed the FAQ for entries about _________
• I was unable to test this on prior versions because _______

⏯ Playground Link

No response

💻 Code

// Your code here

🙁 Actual behavior

The build is failing with the above mentioned error. It only happens on the heroku dev pipeline and builds fine in local environment and when in production pipeline.

🙂 Expected behavior

the build should pass.

Additional information about the issue

No response

Start with the package.json heroku-postbuild script and compare its dependency installation and environment with the local and production builds. Inspect the TypeScript stack at typescript.js:2580 and @ngtools/webpack/src/transformers/make_transform.js:60, then reproduce the failing Angular build. Done means the Heroku dev pipeline completes the build without the undefined kind error, with the environment difference identified.