Convert file path to import statement in YAML Frontmatter

[jaekong]

---
thumbnail: ./hello.jpg
---

^ this does not work

Currently, you cannot provide file paths inside source folder in frontmatter and expect MDsveX to automatically import it. Vite's dynamic import cannot predict complex glob at build-time, so it is difficult to implement at SvelteKit side as well. So it would be great if there was an option for MDsveX to directly insert import statement during markdown to svelte transform. (possible use case - assets like thumbnail image path, background music, maybe custom css file)

Usually for this kind of things, you can just use remark / rehype plugin like with mdsvex-relative-images. But frontmatter area cannot have import statement while it's in markdown AST, and when it's in HTML AST it already has <script context="module"> node generated by MDsveX. Currently I am working around this by regex-ing and re-writing <script module> node which is not ideal since it is very likely to break when MDsveX changes something.

Related Issue at mdsvex-relative-images repo (with my workaround): mattjennings/mdsvex-relative-images#7 (comment)

I don't know if implementing this directly inside MDsveX is a good idea or not, but if this seems like a good way to move forward, I think few lines of code above these lines will do the trick.

MDsveX/packages/mdsvex/src/transformers/index.ts

Lines 335 to 338 in f29f31c

	const fm =
	metadata &&
	`export const metadata = ${stringified};${newline}` +
	`\tconst { ${Object.keys(metadata).join(', ')} } = metadata;`;