Typescript Support
shoyify
is completely written in Typescript
. It supports typescript out of the box as the typings are provided in the bundle.
Props IntelliSense
Prop type IntelliSense and suggestions in template
tags will show up only when using volar. Volar
is a Faster and more accurate TypeScript support provider for Vue 3
as compare to Vetur. Please use Volar
to get type IntelliSense inside template
tags.
How it Works ?
When a component is imported from shoyify and registered locally, the typings will work and IntelliSense too.
<script lang="ts">
import { ShoyoButton } from "../../shoyify";
import { defineComponent, ref } from "vue";
export default defineComponent({
components: {
ShoyoButton,
},
setup() {
const main = ref<string>("Button");
return { main };
},
});
</script>
In the template tag, the component prop typings will show up from the declaration files.
Caveats
When shoyify is registered as a plugin or individual components are registered globally, the typings won't show up.
import shoyify from "../../shoyify";
const app = createApp()
// Tell Vue to use shoyify as a plugin
app.use(shoyify);
app.mount('#app)
or
import {ShoyoButton} from "../../shoyify";
const app = createApp()
// Tell Vue to use the component as a plugin
app.use(ShoyoButton);
app.mount('#app)
Both of the above implementations won't provide IntelliSense inside template tags.
So the only way for now to get prop IntelliSense is to register components locally.