How to debug RangeError: Maximum call stack size exceeded at getApparentType

[liemlylac]

Describe the issue I have issue when using Nuxt with typescript cause RangeError: Maximum call stack size exeeded. But I can access to website without any error.

Or even I ran yarn build, it showed error but keep it continue progress. After build, I run yarn start without any error. It's fine.

I skipped this error, but today I have to resolve this because it stopped progress when I integrate with CICD

To Reproduce Steps to reproduce the behavior:

1. yarn create nuxt-app sample-nuxt
2. Add layouts, pages, and components
3. Run 'yarn dev'
4. See error

Expected behavior Nuxt will run without any error to output. Or any ways to debug what wrong in my code.

Screenshots

i Waiting for file changes
i Memory usage: 755 MB (RSS: 901 MB)                                                                                                                                                                                          
i Listening on: http://localhost:5000/
ERROR  (node:19264) PromiseRejectionHandledWarning: Promise rejection was handled asynchronously (rejection id: 17)                                                        
    at handledRejection (node:internal/process/promises:163:23)
    at promiseRejectHandler (node:internal/process/promises:116:7)
    at Promise.then (<anonymous>)
    at Object.isPending [as default] (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\fork-ts-checker-webpack-plugin\lib\utils\async\isPending.js:5:17)
    at Object.<anonymous> (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\fork-ts-checker-webpack-plugin\lib\hooks\tapDoneToAsyncGetIssues.js:32:42)
    at Generator.next (<anonymous>)
    at D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\fork-ts-checker-webpack-plugin\lib\hooks\tapDoneToAsyncGetIssues.js:8:71
    at new Promise (<anonymous>)
    at __awaiter (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\fork-ts-checker-webpack-plugin\lib\hooks\tapDoneToAsyncGetIssues.js:4:12)
    at D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\fork-ts-checker-webpack-plugin\lib\hooks\tapDoneToAsyncGetIssues.js:23:70
    at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\projects\sample-nuxt\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:92:1)
    at AsyncSeriesHook.lazyCompileHook (D:\projects\sample-nuxt\node_modules\tapable\lib\Hook.js:154:20)
    at Watching._done (D:\projects\sample-nuxt\node_modules\webpack\lib\Watching.js:98:28)
    at D:\projects\sample-nuxt\node_modules\webpack\lib\Watching.js:73:19
    at Compiler.emitRecords (D:\projects\sample-nuxt\node_modules\webpack\lib\Compiler.js:499:39)
    at D:\projects\sample-nuxt\node_modules\webpack\lib\Watching.js:54:20
    at D:\projects\sample-nuxt\node_modules\webpack\lib\Compiler.js:485:14
    at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\projects\sample-nuxt\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:20:1)
    at AsyncSeriesHook.lazyCompileHook (D:\projects\sample-nuxt\node_modules\tapable\lib\Hook.js:154:20)
    at D:\projects\sample-nuxt\node_modules\webpack\lib\Compiler.js:482:27
    at D:\projects\sample-nuxt\node_modules\neo-async\async.js:2818:7
    at done (D:\projects\sample-nuxt\node_modules\neo-async\async.js:3522:9)
    at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\projects\sample-nuxt\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
    at D:\projects\sample-nuxt\node_modules\webpack\lib\Compiler.js:447:33
    at AsyncMFS.writeFile (D:\projects\sample-nuxt\node_modules\memory-fs\lib\MemoryFileSystem.js:289:10)
    at AsyncMFS.<computed> [as writeFile] (D:\projects\sample-nuxt\node_modules\@nuxt\webpack\dist\webpack.js:106:24)
    at writeOut (D:\projects\sample-nuxt\node_modules\webpack\lib\Compiler.js:434:30)
    at Immediate.<anonymous> (D:\projects\sample-nuxt\node_modules\memory-fs\lib\MemoryFileSystem.js:308:4)
    at processImmediate (node:internal/timers:466:21)

 ERROR  RangeError: Maximum call stack size exceeded                                        
RangeError: Maximum call stack size exceeded
    at getApparentType (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:54062:56)
    at getReducedApparentType (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:54078:35)
    at getPropertyOfType (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:54292:20)
    at inferFromProperties (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:63077:38)
    at inferFromObjectTypes (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:63067:21)
    at invokeOnce (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:62750:21)
    at inferFromTypes (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:62716:25)
    at inferToMultipleTypes (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:62887:29)
    at inferFromTypes (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:62682:21)
    at inferFromProperties (D:\projects\sample-nuxt\node_modules\@nuxt\typescript-build\node_modules\typescript\lib\typescript.js:63079:25)

ERROR RangeError: Maximum call stack size exceeded <<< follow error trace, it look nothing is looping??

Additional context this is my package.json file

...
  "dependencies": {
    "@nuxtjs/auth-next": "5.0.0-1648802546.c9880dc",
    "@nuxtjs/axios": "^5.13.6",
    "@nuxtjs/i18n": "^7.3.0",
    "@nuxtjs/toast": "^3.3.1",
    "@vendia/serverless-express": "^4.10.1",
    "bootstrap": "^4.6.2",
    "bootstrap-vue": "^2.22.0",
    "cookie-universal-nuxt": "^2.2.2",
    "core-js": "^3.25.3",
    "flag-icons": "^6.6.6",
    "nuxt": "^2.15.8",
    "nuxt-start": "^2.15.8",
    "vue": "^2.7.12",
    "vue-awesome-swiper": "^3.1.3",
    "vue-infinite-scroll": "^2.0.2",
    "vue-js-modal": "^2.0.1",
    "vue-lazyload": "^1.3.3",
    "vue-loading-overlay": "^3.4.2",
    "vue-server-renderer": "^2.7.12",
    "vue-sticky-directive": "0.0.10",
    "vue-template-compiler": "^2.7.12",
    "vue2-datepicker": "^3.11.0",
    "vue2-google-maps": "^0.10.7",
    "vuelidate": "^0.7.7",
    "vuex-multi-tab-state": "^1.0.17"
  },
  "devDependencies": {
    "@babel/eslint-parser": "^7.19.1",
    "@nuxt/types": "^2.15.8",
    "@nuxt/typescript-build": "^2.1.0",
    "@nuxtjs/eslint-config-typescript": "^11.0.0",
    "@nuxtjs/eslint-module": "^3.1.0",
    "@nuxtjs/google-fonts": "^2.0.0",
    "@nuxtjs/style-resources": "^1.2.1",
    "@nuxtjs/stylelint-module": "^4.1.0",
    "@types/googlemaps": "^3.43.3",
    "@types/jest": "^29.1.1",
    "@types/swiper": "^4.4.12",
    "@types/vue2-datepicker": "^3.3.1",
    "@types/vuelidate": "^0.7.15",
    "@vue/test-utils": "^1.3.0",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "^27.4.4",
    "eslint": "^8.4.1",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-nuxt": "^3.1.0",
    "eslint-plugin-vue": "^8.2.0",
    "jest": "^29.1.2",
    "postcss-html": "^1.5.0",
    "prettier": "^2.7.1",
    "sass": "^1.53.0",
    "sass-loader": "^10.1.1",
    "stylelint": "^14.1.0",
    "stylelint-config-prettier": "^9.0.3",
    "stylelint-config-recommended-vue": "^1.4.0",
    "stylelint-config-standard": "^28.0.0",
    "ts-jest": "^29.0.3",
    "vue-jest": "^3.0.4"
  }
}

[liemlylac]

Today, RangeError show difference traces, still error, yarn dev and yarn build by CLI normally:

 ERROR  RangeError: Maximum call stack size exceeded                                                                                                                                                                       23:46:51
RangeError: Maximum call stack size exceeded
    at isThisless (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:52625:36)
    at createInstantiatedSymbolTable (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:52637:67)
    at resolveObjectTypeMembers (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:52924:27)
    at resolveTypeReferenceMembers (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:52961:13)
    at resolveStructuredTypeMembers (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:53657:25)
    at getPropertyOfType (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:54294:32)
    at createUnionOrIntersectionProperty (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:54093:32)
    at getUnionOrIntersectionProperty (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:54213:28)
    at getPropertyOfUnionOrIntersectionType (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:54222:28)
    at getPropertiesOfUnionOrIntersectionType (D:\projects\sample-nuxt\node_modules\typescript\lib\typescript.js:53708:48)

[josephpickering]

@liemlylac Did you find a solution to this? I've currently got the same issue

[liemlylac]

@josephpickering No bro, I am living with this error :(

[rchl]

In case you are still experiencing this issue, are you able to provide a repo that reproduces it?

[rchl]

Closing due to lack or response and reproduction.