Static variable using another variable leads to Uncaught TypeError: Cannot read properties of undefined
Vue version
3.2.13 & 2.7.14
Link to minimal reproduction
https://github.com/mcenkar/static-field-error-v3
Steps to reproduce
yarn serve, open dev tools
What is expected?
No error
What is actually happening?
When declaring two static variables, where one is using other it causes error:
export default class HelloWorld extends Vue {
public static readonly varOne = 6;
public static readonly varTwo = HelloWorld.varOne / 3;
msg!: string
display = HelloWorld.varTwo
}
Basically display value should be 2 however instead I get following error:
Uncaught TypeError: Cannot read properties of undefined (reading 'varOne')
at eval (index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=ts:21:305)
at ./node_modules/babel-loader/lib/index.js!./node_modules/ts-loader/index.js??clonedRuleSet-41.use[1]!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/components/HelloWorld.vue?vue&type=script&lang=ts (app.js:30:1)
at __webpack_require__ (app.js:255:33)
at fn (app.js:488:21)
at eval (HelloWorld.vue?vue&type=script&lang=ts:5:245)
at ./src/components/HelloWorld.vue?vue&type=script&lang=ts (app.js:129:1)
at __webpack_require__ (app.js:255:33)
at fn (app.js:488:21)
at eval (HelloWorld.vue:3:97)
at ./src/components/HelloWorld.vue (app.js:107:1)
This affects both vue2 and vue3.
Repositories with reproduction:
https://github.com/mcenkar/static-field-error-v2 https://github.com/mcenkar/static-field-error-v3
Workaround is to extract 6 into separate variable, and use that instead of reference to static variable, but it's quite brittle and not-obvious.
System Info
No response
Any additional comments?
No response
This would need to be addressed in the vue-class-component repo - which is in need of someone actually maintaining it.
Normal classes work fine like this:
So there's not much Vue core.