Subscribe on changes!

Component Name and Named Exports Idea for <script setup>

avatar
Mar 28th 2022

I saw some people on Twitter that noted Vue's general usage of default exports for all components. Some people, and myself to an extent, think that named exports are a better practice, but I love <script setup> too much to give it up for named exports.

So I was thinking about enhancing <script setup> with an additional attribute: name. We can use it to specify the name it'll be exported as, as well as potentially the component's name (so it doesn't need to be computed based on the file name) for recursive use of the component.

E.g.

<script setup name="MyComponent"></script>

Would compile to

export const MyComponent = {
    name: "MyComponent" // I'm not 100% set on this part
}

I'm not sure how you would handle someone using a separate script tag to add inheritAttrs or anything, but I bet you can make it work.

avatar
Mar 28th 2022

This is not a duplicate entirely. That issue was for component name and I'm asking for the ability to name the export rather than using a default export.