🐛 BUG: check says type import from Svelte file not found

[danielclausmeyer]

Describe the Bug

We got a component library with Svelte components. Those are build and packed using "svelte-package". For each .svelte file it creates a .svelte.d.ts file with the component type class and the props, events and slots.

In a TypeScript file i am importing one of those prop types with import type { Props } from '@org/package/component/Component.svelte'. astro check complains since version 0.5.0 that this Props is not exported from the file. It definitely is exported.

import type {Props} from '@org/package/component/Component.svelte'

/* Console output */

error ts(2614): Module '"@org/package/component/Component.svelte"' has no exported member 'Props'. Did you mean to use 'import Props from "@org/package/component/Component.svelte"' instead?

import type {Props} from '@org/package/component/Component.svelte'
             ~~~~~

I could also use the barrel file export of the component and then use the ComponentProps util type from svelte, but even then astro check complains about problems that do not actually exist.

import {Component} from '@org/package/component'
import type { ComponentProps } from 'svelte'

type Props = ComponentProps<Component>

/* Console output */

- error ts(2749): 'Component' refers to a value, but is being used as a type here. Did you mean 'typeof Component'?

type Props = ComponentProps<Component>
                            ~~~~~~~~~
- error ts(6133): 'Component' is declared but its value is never read.

import {Component} from '@org/package/component'
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Why would astro check run checks on any file except .astro files anyway?

Steps to Reproduce

1. npm init astro using template framework-svelte
2. Change the Counter.svelte to export the count variable.

   <script lang="ts">
   export let count = 0;
       /* ... */
   </script>

3. Add a TypeScript file that uses the type of this component.

   
   import type { ComponentProps } from "svelte";
   import type Counter from "./components/Counter.svelte";

type Props = ComponentProps

const props: Props = { count: 5 }

console.log(props)

4. Run `npx tsc --noEmit` - It does not show errors
5. Run `npx astro check`
6. Should not throw error but shows this:

npx astro check 13:45:56 [vite] Forced re-optimization of dependencies 13:45:56 [check] Getting diagnostics for Astro files in /workspaces/vofficeGmbh/test/superior-sphere... src/file.ts:4:29 - error ts(2749): 'Counter' refers to a value, but is being used as a type here. Did you mean 'typeof Counter'?

4 type Props = ComponentProps

src/file.ts:2:1 - warning ts(6133): 'Counter' is declared but its value is never read.

2 import type Counter from "./components/Counter.svelte";

Result (5 files):

• 1 error
• 0 warnings
• 1 hint

[danielclausmeyer]

In the steps to reproduce i only how to reproduce the second error i described. For the first one i would need to add svelte-package and a build step and etc. Though I guess both errors have the same source/reason, so i hope this is enough.

[Princesseuh]

Did this work in previous versions? I feel like that most likely never really worked

[danielclausmeyer]

Indeed I cant reproduce it working with any version now. In our project there are no problems with version 0.4.1 and below. The problems start with version 0.5.0.

But when i try it with a clean install like in the steps to reproduce i can not get it to work with the same versions. Though the code is valid and should not throw errors either way.

Why does astro check check TS files?

[Princesseuh]

Indeed I cant reproduce it working with any version now. In our project there are no problems with version 0.4.1 and below. The problems start with version 0.5.0.

But when i try it with a clean install like in the steps to reproduce i can not get it to work with the same versions. Though the code is valid and should not throw errors either way.

Why does astro check check TS files?

There are multiple reasons, notably that we can provide Astro specific diagnostics and it's one of the few ways to support checking in the CLI .ts(x) files that import Astro components.

Since doing those checks is a very expensive process, doing it in one command is generally super beneficial performance wise as well, not to mention the memory usage.