벨벳 키트에서 마크다운 파일을 가져오는 방법은 무엇입니까?

벨벳 키트에서 마크다운 파일을 가져오는 방법은 무엇입니까?

<script>
    import Markdown from '../components/Markdown.svelte';
    import path from '../../static/assets/docs/overview.md';
</script>

<article class="prose prose-red max-w-none">
    <Markdown markdown={path} />
</article>

경고는 다음과 같습니다:

files in the public directory are served at the root path.
Instead of /static/assets/docs/overview.md?import, use /assets/docs/overview.md?import.

사용하면 다음 오류가 발생합니다:

9:30:18 PM [vite] Internal server error: Cannot import non-asset file /assets/docs/overview.md which is inside /public.JS/CSS files inside /public are copied as-is on build and can only be referenced via <script src> or <link href> in html.
  Plugin: vite:import-analysis
  File: /Users/me/www/underwriting-ui/src/routes/docs.svelte
      at TransformContext.transform (/Users/me/www/underwriting-ui/node_modules/vite/dist/node/chunks/dep-713b45e1.js:67350:31)
      at async Object.transform (/Users/me/www/underwriting-ui/node_modules/vite/dist/node/chunks/dep-713b45e1.js:42397:30)
      at async doTransform (/Users/me/www/underwriting-ui/node_modules/vite/dist/node/chunks/dep-713b45e1.js:56738:29)

---

나도 같은 시나리오를 가지고 있다 - 정적 마크다운의 문서는 빌드 시 HTML을 생성해야 한다. 사용하게 되었습니다.

이것을 너의 것에 추가해라

import { plugin as markdown } from 'vite-plugin-markdown'

const config = {
  plugins: [markdown({ mode: ['html', 'toc'], ...})], ...
}

그리고 당신의 벨벳 부품 안에서

import { toc, html } from '~/docs/api/auth.md'

저는 특히 "toc"에 대해 행복합니다. "toc"는 다음과 같은 것을 출력합니다.

[{ level: '1', content: 'foo' }, { level: '2', content: 'bar' }, ...]

---

마크다운 파일(또는 다른 파일)을 접미사를 통해 원시 텍스트로 가져올 수 있습니다. 예:

import my_markdown from "$lib/data/my_markdown.md?raw";