如何编写异步请求以获取降价文件的内容？苗条

Question

我正在使用 Svelte 构建我的博客，但我正在将结构切换为通过 JSON API.

访问

现在很容易获得降价元数据和路径，但我也想获得内容。

我如何修改此 posts.json.js 文件以获取内容？

  const allPostFiles = import.meta.glob('../blog/posts/*.md')
  const iterablePostFiles = Object.entries(allPostFiles)

  const allPosts = await Promise.all(
    iterablePostFiles.map(async ([path, resolver]) => {
      const { metadata } = await resolver()
      const postPath = path.slice(2, -3)

      return {
        meta: metadata,
        path: postPath
      }
    })
  )

  const sortedPosts = allPosts.sort((a, b) => {
    return new Date(b.meta.date) - new Date(a.meta.date)
  })

  return {
    body: sortedPosts
  }

Answer 1

安装并启用 vite-plugin-markdown

// svelte.config.js
import { plugin as markdown, Mode } from "vite-plugin-markdown";

/** @type {import('@sveltejs/kit').Config} */
export default {
  kit: {
    vite: {
      plugins: [markdown({ mode: Mode.HTML })],
    },
  },
};

那么内容将以 html 的形式提供，前文数据将以 attributes

的形式提供

    iterablePostFiles.map(async ([path, resolver]) => {
      const { attributes, html } = await resolver();

      return {
        attributes,
        html,
        path: path.slice(2, -3),
      };
    })

（我建议通过 frontmatter 将元数据添加到降价文件中）

Answer 2

上面的答案非常有效，但它也可以使用以下代码调整 API：


  const allPosts = await Promise.all(
    iterablePostFiles.map(async ([path, resolver]) => {
      const { metadata } = await resolver()
      // because we know every path will start with '..' and end with '.md', we can slice from the beginning and the end
      const postPath = path.slice(2, -3)

      const post = await resolver()
      const content = post.default.render()

      return {
        meta: metadata,
        path: postPath,
        text: content
      }
    })
  )

重要的补充是：

      const post = await resolver()
      const content = post.default.render()

使用这些变量链来避免使用JS保留字default。

如何编写异步请求以获取降价文件的内容？苗条

How do I write an async request to get a markdown file's content? Svelte

api

markdown

json

svelte