Property 'expand' does not exist on type '{}'.

[PabloLec]

Hi!

I'm using a template similar to https://hc200ok.github.io/vue3-easy-data-table-doc/features/expand-slot.html and specifically :

<template #expand="item">

But, I think since I upgraded to vue-tsc 1.4.1 I get this error on build :

src/components/DataTable.vue:27:16 - error TS2339: Property 'expand' does not exist on type '{}'.

 <template #expand="item">

Any idea why ? I'm clueless

[jxn-30]

I do have the same issue and I'm not sure how to fix it in a nice way. I've found https://github.com/vuejs/language-tools/issues/818 which brought me on that simple workaround that I don't like that much: Register the component globally: https://hc200ok.github.io/vue3-easy-data-table-doc/getting-started.html#regist-globally

Also when using Options API there could be a another way (as I'm using Composition API I did not test anything with that yet). For Composition API I did not found another workaround yet.

There is the Vue3.3+ helper function defineSlots (https://vuejs.org/api/sfc-script-setup.html#defineslots) which allows to add TypeScript-Definitions to the component. However that will not be included in the build and thus not in the package => it doesn't help us. Maybe there is a way to make this available for users of the package. If so, I have not found a way yet.

FTR this is the defineSlots-call I've created for /src/components/DataTable.vue and that should fit:

interface SlotPagination {
    isFirstPage: boolean;
    isLastPage: boolean;
    currentPaginationNumber: number;
    maxPaginationNumber: number;
    nextPage: () => void;
    prevPage: () => void;
}

defineSlots<{
    'customize-header'(): any;
    loading(): any;
    'empty-message'(): any;
    pagination(pagination: SlotPagination): any;
}
    // header slots
  & Record<'header' | `header-${string}`, (header: HeaderForRender) => any>
    // item slots
  & Record<`item-${string}` | 'expand', (item: Item) => any>
  & Record<'item', (props: {column: string; item: Item}) => any>
    // body slots
  & Record<'body', (pageItems: Item[]) => any>
  & Record<`body-${'prepend'|'append'}`, (props: {
        items: Item[];
        pagination: SlotPagination;
        headers: HeaderForRender[];
    }) => any>
>();