Props throw TypeError: Cannot redefine property: xxx (with workaround)

[whitetrefoil]

I just got this error during upgrading of legacy project.

Post here just In case 😹 anyone else meets this problem during upgrading.

Workaround

Set "target" of TypeScript to "ES2021" or lower.

Analysis

TS changes the transpiled JS code of class properties when targeting ES2022 or higher (not sure started from what version of TS, just tested the latest v4.8.4).

// for a prop
@Prop disabled = p({type: Boolean, default: false})

// ES2021 or lower
_this.disabled=Object(av_ts__WEBPACK_IMPORTED_MODULE_1__["p"])({type:Boolean,default:false});

// ES2022 or higher
_defineProperty(_assertThisInitialized(_this),"disabled",Object(av_ts__WEBPACK_IMPORTED_MODULE_1__["p"])({type:Boolean,default:false}));

Since collectData in core.ts also uses defineProperty, this change causes redefine property errors.

[HerringtonDarkholme]

Thanks for the debugging tip! decorator is too complex to be used :(

[whitetrefoil]

Anyway the workaround works. Since Vue 3 has been release for long, I guess only aged projects use this now, targeting ES2021 should be totally enough. 😹