Vue wrapper build script fails with Vue 2.7

[budnix]

Description

Using the latest installation (npm i) on the repo and trying to build the Vue wrapper (npm run in vue build) the script fails.

The error message:

./src/index.ts → ./commonjs/vue-handsontable.js...

[!] (plugin rpt2) Error: /Users/budnix/Documents/Projects/handsontable/wrappers/vue/src/HotTable.vue?rollup-plugin-vue=script.ts(30,5): semantic error TS2322: Type '{ name: string; props: VueProps<HotTableProps>; watch: { mergedHotSettings: (value: any) => void; }; data: () => { __internalEdit: boolean; miscCache: { currentSourceColumns: any; }; ... 4 more ...; hotInstance: any; }; ... 4 more ...; version: any; }' is not assignable to type 'HotTableComponent<Vue, HotTableData, HotTableMethods, {}, HotTableProps>'.
  Object literal may only specify known properties, and 'name' does not exist in type 'HotTableComponent<Vue, HotTableData, HotTableMethods, {}, HotTableProps>'.
src/HotTable.vue?rollup-plugin-vue=script.ts

or

./src/index.ts → ./commonjs/vue-handsontable.js...

[!] (plugin rpt2) Error: /Users/budnix/Documents/Projects/handsontable/wrappers/vue/src/HotColumn.vue?rollup-plugin-vue=script.ts(14,20): semantic error TS2314: Generic type 'ThisTypedComponentOptionsWithRecordProps' requires 6 type argument(s).

I've checked the latest version of the wrapper with the Vue CLI and it seems that the issue is about the build dependencies mismatch on the build side and not about the dependencies mismatch on the developers' app side.

Your environment

• Handsontable version: -
• Browser name and version: -
• Operating system: -

[maksim-shila]

Handsontable not compatible with vue 2.7 since ThisTypedComponentOptionsWithRecordProps takes one more generic argument

Do you plan to update?

EDIT: vue released only 4 days ago https://github.com/vuejs/vue/releases

[budnix]

@maksim-shila I wonder if you have the error only while building the component within monorepo? Or the same error is thrown in Vue 2.7 app that uses the official @handsontable/vue package?

[maksim-shila]

Here is example of project with this error example.nuxt.zip

Only adding exact version of vue to package.json did the trick "vue": "2.6.14", "vue-server-renderer": "2.6.14", "vue-template-compiler": "2.6.14"

[aninde]

npm run in vue build works after npm i with LTS node v16.15.1, npm v8.11.0 with v12.1.2 200cca2e2599fcc2bab1e9439803ec535799423a.

[warpech]

@maksim-shila we will investigate the problem.

This issue is about a failure with Vue 2.7 in our build chain, which caused us to temporarily downgrade the version used in our build chain to Vue 2.6.

Nevertheless, we verified that in normal conditions Handsontable can be used with Vue 2.7 (including TypeScript), so your problem is something that we yet have to investigate.

[AMBudnik]

Closed as solved in Handsontable v12.1.2

[warpech]

@maksim-shila if you still experience the problem, please contact support@handsontable.com.

[budnix]

I reopened the issue as the bug still exists. The related PR solves the problem but currently, the change is not backward compatible with Vue 2.6 so it needs to be investigated to support all Vue ^2 semver range versions.