Exporting Nested SFC's
louiss0 opened this issue · comments
At the moment I don't think you can export nested SFC's. This is useful because there are times when three components are. dependent on each other. How about a block for exporting components? Or you could use a special keyword for exporting them export
.
Things that change together should live together.
Export block example
<export>
{ example }
</export>
<component name="example">
<template>
I'm component example.
</template>
</component>
Export keyword example
<component name="example" export>
<template>
I'm component example.
</template>
</component>
Thanks for the suggestion! Check out the latest release
Example usage:
<!-- App.vue -->
<template>
<div>
Hello, App!
<HelloComponent />
</div>
</template>
<script setup lang="ts">
import { HelloComponent } from './components/HelloWorld.vue';
</script>
<!-- HelloWorld.vue -->
<template>
<div>
Hello, World!
</div>
</template>
<component name="hello-component" lang="vue">
<template>
<div>
Hello, Component!
</div>
</template>
</component>
I don't think they should auto-export. But nice achievement.
I assume the template is the default one but the others are put in separate exports. automatically. I guess this means devs can choose between exporting multiple components or exporting one as the default and then others as components. The auto-exporting will cause some problems along the line. To prevent auto export there would have to be further nesting.