Skip to content

Fix TypeScript errors when using the truncateMixin

Erwan Rouchet requested to merge fix-truncate-mixin-typing into master

Using the truncateMixin within a component that uses TypeScript causes some strange typing errors where all child components are of type never:

<template>
  // Argument of type '{ blah: number }' is not assignable to parameter of type 'never'.
  <Thing :blah="42" />
</template>

<script lang="ts">
// [snip]
export default defineComponent({
  components: {
    Thing
  },
  mixins: [
    truncateMixin
  ]
})
</script>

This does not occur with the corporaMixin. I found that any mixin that does not include a computed: causes this issue, and this can either be fixed by adding computed: {} on the mixin or using defineComponent(), as Vue's typing treats mixins as if they were components.

These errors tend to override other errors, as TypeScript can no longer check the types of the values we pass to other components. Even if we can only get proper type checking in VSCode for now, let's at least try to get it to work well…

Merge request reports