After 0.31.1, problems caused by type having to be placed in the head

[lykl]

As I mentioned in #901, although the editor no longer reported an error at that time, I did not test the packaging, now I test the packaging and found the packaging error, the problem is the same as the last issue, I used vite + vue-tsc.
Attach an error log:

src/components/roleModal.vue:168:21 - error TS2339: Property 'changeLoading' does not exist on type '{ $: ComponentInternalInstance; $data: {}; $props: Partial<{ width: string; title: string; modelValue: 
boolean; asyncClose: boolean; showBtn: boolean; destroyOnClose: boolean; }> & Omit<...>; ... 10 more ...; $watch(source: string | Function, cb: Function, options?: WatchOptions<...> | undefined): WatchStopHandle; }...'.

168     modalRef.value?.changeLoading(false)

[lykl]

Eventually, I had to re-type the function in the corresponding file.

<script lang="ts">
export interface ModalExpose {
  changeLoading: (loading: boolean) => void
}
</script>
<script lang="ts" setup>
...
<script>

I'm not sure there's a better way.

[theoephraim]

From what I can tell, while this did change recently in vue-tsc, I believe it is intentional with the current script setup design. Any additional named exports are supposed to be in an additional <script> tag, so it makes sense that type-only exports would be included in that rule.

See related issues:

• vue-tsc complains when exporting additional TS types from SFC #923
• Show more helpful error when trying to export from script setup #940

I just added some changes to the vue 3 docs that explicitly call this out, although I'd love some more confirmation from the vue core team that this is correct and desired going forward.

Not really so bad once you know... Although automatically hoisting things and just working would definitely be better. It also still leaves some weird edge cases where you need things exported that involve other things that are not, but need to be available in the template. 🤷

[lykl]

From what I can tell, while this did change recently in vue-tsc, I believe it is intentional with the current script setup design. Any additional named exports are supposed to be in an additional <script> tag, so it makes sense that type-only exports would be included in that rule.

See related issues:

• vue-tsc complains when exporting additional TS types from SFC #923
• Show more helpful error when trying to export from script setup #940

I just added some changes to the vue 3 docs that explicitly call this out, although I'd love some more confirmation from the vue core team that this is correct and desired going forward.

Not really so bad once you know... Although automatically hoisting things and just working would definitely be better. It also still leaves some weird edge cases where you need things exported that involve other things that are not, but need to be available in the template. 🤷

Thanks for your reply.
The current problem is that the verification rules for volar and vue-tsc are inconsistent, which is certain.
However, I may have to accept that typeof cannot be used by export.

[johnsoncodehk]

@lykl see vuejs/core#4397 (comment).