typescript troubles

[rlindner81]

I'm getting an odd typescript error, when using your slider in my vue3 (typescript) project.

src/components/MinExample.vue:3:6 - error TS2322: Type '{ min: number; max: number; step: number; modelValue: number; disabled: true; }' is not assignable to type 'ComponentProps<typeof import("/Users/rlindner/dev/tracker/frontend/node_modules/@vueform/slider/src/Slider")>'.
  Property 'Slider' is missing in type '{ min: number; max: number; step: number; modelValue: number; disabled: true; }' but required in type 'typeof import("/Users/rlindner/dev/tracker/frontend/node_modules/@vueform/slider/src/Slider")'.

3     <Slider :min="0" :max="1000" :step="1" v-model="value" :disabled="true" />
       ~~~~~~

  node_modules/@vueform/slider/src/Slider.d.ts:33:1
    33 export default Slider;
       ~~~~~~~~~~~~~~~~~~~~~~
    'Slider' is declared here.


Found 1 error in src/components/MinExample.vue:3

You can reproduce it based on the basic vue3 template
npm create vue say yes to typescript and try to build something with the following component:

<template>
  <div>
    <Slider :min="0" :max="1000" :step="1" v-model="value" :disabled="true" />
    <span>${value}</span>
  </div>
</template>

<script lang="ts">
import Slider from "@vueform/slider";
export default {
  components: {
    Slider,
  },
  data() {
    return {
      value: 10,
    };
  },
};
</script>

<style src="@vueform/slider/themes/default.css"></style>

Unfortunately the only workaround I found as to disable typescript completely for any component that uses the Slider.

[arsenitem]

Same problem

[khalo-sa]

same here

[DMOAbove]

Same here too.

[DMOAbove]

Found the culprit:
https://github.com/vueform/slider/blob/main/src/index.d.ts#L2

Removing this line solves it.

[adamberecz]

Removed the export in 2.1.7 - thanks for notice.

[devilmark84]

Removed the export in 2.1.7 - thanks for notice.

Sorry but without that line VS Code says No default export found in imported module "@vueform/slider" while I'm doing import Slider from "@vueform/slider";.
I can't understand why you removed it. 🤷🏻‍♂️

[ehibes]

eslint returns an error error No exported names found in module '@vueform/slider' importing the slider on nuxt3 :

import Slider from '@vueform/slider'

Can you please reopen this issue ? @rlindner81

[DMOAbove]

Why it was removed? Simple... with that line, we are not able to build:

So the solution for your current problem may not be so trivial as put back that line again.

[rlindner81]

eslint returns an error error No exported names found in module '@vueform/slider' importing the slider on nuxt3 :

import Slider from '@vueform/slider'

Can you please reopen this issue ? @rlindner81

I'm not using this module anymore. I switched to vuetify. Please re-post the issue yourself if needed.