wheatjs / vite-plugin-vue-type-imports

Import types in Vue SFC for defineProps
223 stars 16 forks source link

Can't set enam as default prop #20

Closed sanasus closed 1 year ago

sanasus commented 1 year ago

Reproduction: https://stackblitz.com/edit/vitejs-vite-sgpknk?file=src%2Fcomponents%2FTestEnum%2FTestEnum.vue,src%2Fcomponents%2FTestEnum%2Fprops.ts,src%2Fcomponents%2FTestEnum%2Ftypes.ts&terminal=dev

I also have components in which it works

Zolyn commented 1 year ago

I have multiple solutions in mind, but I need to finish other work to decide which one is better, so this issue will not be fixed soon, and I apologize for that.

As a workaround, you can put the values in withDefaults in another file and import it.

props.ts

import { PropEnum } from './types';

export interface TestEnumProps {
  propEnum?: PropEnum;
}

export const defaultProps: TestEnumProps = {
  propEnum: PropEnum.ONE
}

TestEnum.vue

<script setup lang="ts">
import { TestEnumProps, defaultProps } from './props';

const props = withDefaults(defineProps<TestEnumProps>(), { ...defaultProps });
console.log('props.propEnum', props.propEnum);
</script>

<template>
  <pre>TestEnum: {{ props.propEnum }}</pre>
</template>

If you want to be able to use the imported variables directly instead of writing { ...defaults }, try this

NOTE: This is not the only workaround, and if anyone has a better one, feel free to suggest it.

sanasus commented 1 year ago

https://stackblitz.com/edit/vitejs-vite-sgpknk?file=src%2Fcomponents%2FTestEnum%2FTestEnum.vue,src%2Fcomponents%2FTestEnum%2Fprops.ts,src%2Fcomponents%2FTestEnum%2Ftypes.ts&terminal= разработчик

Looks good, we can store default props in a separate file as well

Zolyn commented 1 year ago

Should be fixed in v0.2.2