Add possibility to keep @component docs when exporting with context="module"

[koodeau]

Describe the problem

I have some well documented components that were exported from index.svelte with context="module" but when I import them I cannot see any documentation from @component or even some of its types.

some example here:

Component.svelte

<script>
...
</script>

<slot />

<!-- 
  @component

Here are my docs how to use this component
 -->

then index.svelte:

<script context="module">
	export { default as Component } from './Component.svelte';
</script>

and after importing it from any other svelte page for example:

<script>
     import { Component } from '$lib';
</script>

<Component />

when I hover over this import it shows import Component instead of my documentation

Describe the proposed solution

I would like to see it keeping my documentation when importing components that was exported from entrypoint file in this case index.svelte

Alternatives considered

It works if I export it in .js file instead of .svelte but then it cannot resolve .svelte extension imported/exported from index.js - I would like to reference this in another issue, because it makes packaging using svelte-kit useless for me. But maybe i missed some configs back then.

Or maybe it's a bug in VS Code extensions

Importance

would make my life easier

Additional Information

No response

[jasonlyu123]

The problem is not the docs missing when exporting with context=module. It's because the Svelte language server doesn't support resolving svelte modules without extension. So the '$lib' won't be resolved to $lib/index.svelte.

And I tried it with a svelte kit project. It also doesn't seem to work either, at least the default config. If you want to re-export. just use a js file as you mentioned.

[koodeau]

@jasonlyu123 I do not need to import with /index.svelte. Check https://github.com/koodeau/metawrite. Maybe there is a chance to keep clean import and keep docs. But with import from index.js it says cannot resolve ".svelte" ...

[koodeau]

I just specified $lib as an example here, but my use case is run package script and then import it as npm package in my other projects. It would be much better to have import { Component } from "my-package" and keep docs and types

I do have exports in my package.json

"exports": {
    ".": "./index.svelte",
     ...
  }

and

"type": "module",
"svelte": "./index.svelte",
"main": "./index.svelte",
"types": "./index.d.ts",

[jasonlyu123]

The "cannot resolve '.svelte'" error can be solved when you have a /// <reference types="svelte" /> on the top of your js file. Or a types: [ "svelte" ] in your tsconfig. I don't know if exporting from context="module" is a good idea. Let's see if other people have any opinions. But both seem fine in terms of component docs. I can see the docs in your library.

[koodeau]

Docs was the issue of my d.ts files. types: [ "svelte" ] wasn't helping with resolving ".svelte" error. I'll try with /// <reference types="svelte" />

[koodeau]

I still get such issue when exporting from index.js:

[koodeau]

@jasonlyu123 I gathered a bit more info

i do have default exports in index.js with /// <reference types="svelte" />

When I install my library with npm install metawrite it causes errors such as:

<Component /> is not a valid SSR component

or

Uncaught (in promise) Syntax Error: import not found: fetch

fetch used from cross-fetch which is a dependency of a dependency that my library is using

or

 Unknown file extension ".svelte"

Temporary fixes

But when I manually add it in package.json as following:

 "metawrite": "file:./package"

It works fine, just as fine as importing it from the $lib but with d.ts files.

I copied generated package folder into my project and it worked, but only when I install it from npm it causes many random errors that happen separately if fixing each of them in svelte.config.js