Typescript: ERROR TypeError: Cannot read property 'kind' of undefined

[emdahlstrom]

Hi! I'm seeing this in my Nuxt typescript projects recently. When I google the error I get lots of results from other frameworks but none from Nuxt. I might just be doing something wrong, but I've got the same error in two separate codebases.

Any ideas how to debug this further?

Looking at issues with the same message, they have been fixed by upgrading to typescript 4.0 but we're already on 4.0.3.

 ERROR  TypeError: Cannot read property 'kind' of undefined                                                                                                       10:55:42
TypeError: Cannot read property 'kind' of undefined
    at Object.isEntityNameExpression (/home/em/code/interact/node_modules/typescript/lib/typescript.js:17115:21)
    at serializeMaybeAliasAssignment (/home/em/code/interact/node_modules/typescript/lib/typescript.js:48356:42)
    at serializeSymbolWorker (/home/em/code/interact/node_modules/typescript/lib/typescript.js:47874:49)
    at serializeSymbol (/home/em/code/interact/node_modules/typescript/lib/typescript.js:47825:38)
    at /home/em/code/interact/node_modules/typescript/lib/typescript.js:47800:25
    at Map.forEach (<anonymous>)
    at visitSymbolTable (/home/em/code/interact/node_modules/typescript/lib/typescript.js:47799:33)
    at serializeAsNamespaceDeclaration (/home/em/code/interact/node_modules/typescript/lib/typescript.js:48162:25)
    at serializeAsFunctionNamespaceMerge (/home/em/code/interact/node_modules/typescript/lib/typescript.js:48123:25)
    at serializeMaybeAliasAssignment (/home/em/code/interact/node_modules/typescript/lib/typescript.js:48401:29)

dependencies from package.json:

"dependencies": {
    "@chenfengyuan/vue-qrcode": "1.0.2",
    "@nuxt/http": "0.6.0",
    "@nuxt/typescript-runtime": "^2.0.0",
    "@nuxtjs/axios": "5.12.2",
    "@nuxtjs/component-cache": "1.1.6",
    "@nuxtjs/dotenv": "1.4.1",
    "@nuxtjs/firebase": "4.2.2",
    "@nuxtjs/google-analytics": "2.4.0",
    "@nuxtjs/google-tag-manager": "2.3.2",
    "@nuxtjs/markdownit": "1.2.10",
    "@nuxtjs/sitemap": "2.4.0",
    "@nuxtjs/toast": "3.3.1",
    "@nuxtjs/vendor": "1.1.7",
    "@tailwindcss/ui": "0.6.2",
    "axios": "0.20.0",
    "clearingnummer": "0.10.0",
    "contentful": "7.14.7",
    "contentful-import": "7.9.12",
    "contentful-rich-text-vue-renderer": "1.1.5",
    "cookie-universal-nuxt": "2.1.4",
    "countup.js": "2.0.6",
    "date-fns": "2.16.1",
    "diff-dates": "1.0.12",
    "dotenv": "8.2.0",
    "emoji-regex": "9.0.0",
    "epic-spinners": "1.1.0",
    "firebase": "7.23.0",
    "grpc": "1.24.3",
    "is-personnummer": "1.1.3",
    "lodash": "4.17.20",
    "lodash.find": "4.6.0",
    "lodash.findkey": "4.6.0",
    "lodash.forown": "4.4.0",
    "loggly-jslogger": "2.2.2",
    "material-design-icons": "3.0.1",
    "nuxt": "2.14.7",
    "nuxt-facebook-pixel-module": "1.3.0",
    "nuxt-imagemin": "1.0.0",
    "nuxt-mq": "2.0.1",
    "nuxt-rollbar-module": "1.1.0",
    "pug": "2.0.4",
    "query-string": "6.13.5",
    "rollbar": "2.19.3",
    "se-orgnr-validator": "1.0.3",
    "spinkit": "2.0.1",
    "string-template-js": "1.0.3",
    "vue-affix": "0.5.2",
    "vue-analytics": "5.22.1",
    "vue-async-computed": "3.8.2",
    "vue-confetti": "2.2.1",
    "vue-content-loader": "0.2.3",
    "vue-countup-directive": "1.2.3",
    "vue-countup-v2": "4.0.0",
    "vue-flickity": "1.2.1",
    "vue-float-label": "1.6.1",
    "vue-focus": "2.1.0",
    "vue-images-loaded": "1.1.2",
    "vue-material-design-icons": "1.6.0",
    "vue-motion": "0.2.3",
    "vue-multiselect": "2.1.6",
    "vue-no-ssr": "1.1.1",
    "vue-promise-btn": "2.0.2",
    "vue-qrcode-reader": "2.3.13",
    "vue-resize-directive": "1.2.0",
    "vue-rollbar": "1.0.0",
    "vue-scroll": "2.1.13",
    "vue-scrollto": "2.17.1",
    "vue-select": "3.10.3",
    "vue-server-renderer": "2.6.11",
    "vue-sticky-directive": "0.0.10",
    "vue-template-compiler": "2.6.12",
    "vue-text-mask": "6.1.2",
    "vue-the-mask": "0.11.1",
    "vue-unicons": "2.0.3",
    "vuefire": "2.2.1",
    "vuelidate": "0.7.5",
    "xstate": "4.7.8"
  },
  "devDependencies": {
    "@babel/plugin-proposal-optional-chaining": "7.11.0",
    "@nuxt/types": "2.14.7",
    "@nuxt/typescript-build": "^2.0.3",
    "@nuxtjs/eslint-config-typescript": "^4.0.0",
    "@nuxtjs/storybook": "1.2.0",
    "@nuxtjs/tailwindcss": "3.1.0",
    "@types/vuelidate": "^0.7.13",
    "babel-core": "6.26.3",
    "babel-eslint": "10.1.0",
    "babel-preset-vue": "2.0.2",
    "cypress": "4.12.1",
    "eslint": "6.8.0",
    "eslint-config-prettier": "6.12.0",
    "eslint-config-standard": "14.1.1",
    "eslint-loader": "3.0.4",
    "eslint-plugin-html": "6.1.0",
    "eslint-plugin-import": "2.22.1",
    "eslint-plugin-node": "11.1.0",
    "eslint-plugin-prettier": "3.1.4",
    "eslint-plugin-promise": "4.2.1",
    "eslint-plugin-standard": "4.0.1",
    "node-sass": "4.14.1",
    "npx": "10.2.2",
    "prettier": "1.19.1",
    "pug-plain-loader": "1.0.0",
    "sass-loader": "8.0.2"
  }

[drakulis]

Unfortunately devs don't follow semantic versioning and they introduces breaking changes in patch releases :fearful:.

@devs Yes, changing core library major version (typescrtipt 3.x -> 4.x) is a breaking change!

It just broke my production build few weeks ago because build pipeline suddenly installed new typescript.

@emdahlstrom quick solution for you will be to lock "@nuxt/typescript-build": "2.0.2" (no ^ version specifier!), where typescript 3.9 is used

[emdahlstrom]

@drakulis Thanks! That fixes the problem.

[austinbakker]

Hi,

I think I am having the same kind of problem. I am rendering it

PROJECT STRUCTURE

- project
  - app
    - client
       - pages
       - components
       - .....
       nuxt.config.js
       tsconfig.json
       vue-shim.d.ts
  - dist
     - client
       index.html
       ......
  - node_modules
  package.json

console Error

TypeError: Cannot read property 'config' of null
    at O (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:1:1329)
    at exports.computed (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:10108)
    at setup (app/client/components/main/header_component.vue?2172:44:0)
    at C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@nuxtjs\composition-api\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:9396
    at C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@nuxtjs\composition-api\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:8356
    at me (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@nuxtjs\composition-api\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:7065)
    at C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@nuxtjs\composition-api\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:8337
    at a.r.data (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\@nuxtjs\composition-api\node_modules\@vue\composition-api\dist\vue-composition-api.common.prod.js:15:8842)
    at C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue\dist\vue.runtime.common.prod.js:6:28667
    at C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue\dist\vue.runtime.common.prod.js:6:28727
    at pn (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue\dist\vue.runtime.common.prod.js:6:28934)
    at a.e._init (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue\dist\vue.runtime.common.prod.js:6:32700)
    at new a (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue\dist\vue.runtime.common.prod.js:6:30340)
    at Vi (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue-server-renderer\build.prod.js:1:66341)
    at io (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue-server-renderer\build.prod.js:1:70571)
    at ro (C:\Users\quint\OneDrive\Bureaublad\cgrWebsite\node_modules\vue-server-renderer\build.prod.js:1:70244)

It says the error is coming from header_component.vue. But when i change the ssr config to false it throws no errors and renders correctly

//nuxt.config.js
export default {
  target: 'static',
  ssr: true, <- gives error (if false gives no error)
  srcDir: '.',
  env: { hostname: 'https://customgamingrig.com' },
  modulesDir: ['../../node_modules'],
  rootDir : ['./app/client'],
  generate: {
    dir: '../../dist/client',
    routes() {
      return axios.get('https://customgamingrig-15006.ey.r.appspot.com/posts').then(res => {
        return res.data.map(post => {
          return {
            route: '/blog/' + post.id,
            payload: post
          }
        })
      })
    }
  },

Package.json

{
  "name": "cgrwebsite",
  "version": "1.0.0",
  "description": "",
  "engines": {
    "node": ">=12.19.0"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "@nuxt/typescript-runtime": "^2.0.0",
    "@nuxtjs/composition-api": "^0.13.5",
    "@nuxtjs/gtm": "^2.3.2",
    "@nuxtjs/sitemap": "^2.4.0",
    "@nuxtjs/strapi": "^0.1.7",
    "@sendgrid/mail": "^7.3.0",
    "@stripe/stripe-js": "^1.10.0",
    "@types/cors": "^2.8.8",
    "@types/express": "^4.17.8",
    "@types/node": "^14.14.5",
    "@types/stripe-v3": "^3.1.21",
    "@vue/composition-api": "^1.0.0-beta.18",
    "babel-plugin-transform-decorators": "^6.24.1",
    "core-js": "^3.6.5",
    "cors": "^2.8.5",
    "es6-promise": "^4.2.8",
    "express": "^4.17.1",
    "npm-run-all": "^4.1.5",
    "nuxt": "2.14.7",
    "nuxt-typed-vuex": "^0.1.22",
    "showdown": "^1.9.1",
    "stripe": "^8.119.0",
    "ts-node": "^9.0.0",
    "ts-node-dev": "^1.0.0",
    "vue-meta": "^2.4.0",
    "vuex-module-decorators": "^1.0.1",
    "vuex-persist": "^3.1.3"
  },
  "devDependencies": {
    "@nuxt/types": "2.14.7",
    "@nuxt/typescript-build": "^2.0.2",
    "@aceforth/nuxt-optimized-images": "^1.3.0",
    "@nuxtjs/tailwindcss": "^3.2.0",
    "imagemin-mozjpeg": "^9.0.0",
    "imagemin-pngquant": "^9.0.1",
    "imagemin-svgo": "^8.0.0",
    "lqip-loader": "^2.2.1",
    "node-sass": "^4.14.1",
    "responsive-loader": "^2.2.0",
    "sass-loader": "^10.0.4",
    "sqip-loader": "^1.0.0",
    "webp-loader": "^0.6.0"
  },
  "scripts": {
    "build:client": "nuxt-ts generate ./app/client ",
    "build:server": "tsc --outDir dist/functions app/server/src/intent.ts",
    "build": "npm-run-all -s build:*"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/austinbakker/cgrWebsite.git"
  },
  "bugs": {
    "url": "https://github.com/austinbakker/cgrWebsite/issues"
  },
  "homepage": "https://github.com/austinbakker/cgrWebsite#readme"
}

[kevinmarrec]

Sounds the main issue has been fixed

@austinbakker You can do yarn why typescript to know if you have multiple typescript versions installed

[BlowAlone]

Have the same issue on "@nuxt/typescript-build": "^2.0.3",
Is there any plans to fix this without putting version of typescript-build on 2.02?

[kevinmarrec]

If you use last typescript-build you'll have TypeScript 4, so it's your job to find in your project which package may use a lower TypeScript version (as I said : yarn why typescript). If there is multiple TypeScript version installed, it leads to errors really difficult to debug.

You can use yarn resolutions to force a TypeScript version.

[emiller12]

@austinbakker I am currently experiencing the same error when running nuxt generate on a nuxt app that pulls in a library the uses @vue/composition-api. Did you ever manage to resolve your issue?