Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Support content "sections"

Đang mở
#209 4 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
5/5
Thời gian dự kiến
Hơn một tuần
Mức phù hợp với người mới
25/100
Loại issue
Tính năng
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Đình trệ
Công nghệ
typescript
Lĩnh vực
content

Hướng nghiên cứu

Bắt đầu bằng việc xem xét các entry point makeSource và defineDocumentType được nêu trong issue, sau đó theo dõi cách các đường dẫn tài liệu và các trường được tính toán trở thành các collection như allDocsSections. So sánh các section lồng nhau được yêu cầu và metadata theo từng section với các ví dụ của Hugo và Docusaurus. Công việc được xem là hoàn tất khi API được đề xuất và cấu trúc typed đệ quy được triển khai và xác minh bằng các test phù hợp.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

feature

One of the things that I really like about Hugo is its sections feature, which enables you to separate nested directories of content into well-defined groups. So instead of a kind of "flat" array of files you end up getting a nested structure like this:

Documentation
\_ Getting started
  \_ Installation
  \_ Platforms
\_ Administration
  \_ Kubernetes
    \_ Setup
    \_ Configuration
\_ etc

As expected, sections can be infinitely nested and each can have its own metadata. I don't necessarily endorse the way that Hugo does this (you need to sprinkle _index.md files throughout your tree) but I do think that having this kind of rich structure available to you is great for creating tables of content, sidebar navs, and all of that good stuff. Personally, it's the thing that I'm missing the most as I cross the chasm from mostly doing things in Hugo to doing things in JS world.

I could envision being able to do something like this in Contentlayer:

export const Doc = defineDocumentType(() => ({
  name: 'Doc',
  filePathPattern: `**/*.md`,
  fields: {
    title: {
      type: 'string',
      description: 'The title of the doc',
      required: true,
    },
  },
  computedFields: {
    url: {
      type: 'string',
      resolve: (post) => `/docs/${post._raw.flattenedPath}`,
    },
  },
}))

export default makeSource({
  contentDirPath: 'docs',
  documentTypes: [Doc],
  // tiny little change
  sections: true,
})

This could export an allDocsSections object of type Sections<Doc> that would enable you to recurse through the tree.

<ul>
  {allDocs.sections.map(section => (
  <li>
    <p>{section.title}</p>
    
    <ul>
      {section.docs.map(doc => (
        <li>
          {doc.title}
        </li>
      ))}
      
      {section.sections.map(section => ( /* nest */ ))}
    </ul>
  </li>)}
</ul>

This is very off the cuff but hopefully provides some sense of what I'm suggesting. I'd be quite happy to help out with this if others find the idea compelling. Just wanted to register it here in this forum.

Note: Docusaurus also supports this using a _category_.{json|yml} file that creates a new "category" (basically an analogue to the sections concept) wherever it's found in the directory tree.

Ngôn ngữ chính
TypeScript
Star
3.5k
Fork
192
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của contentlayerdev/contentlayer

Tất cả issue của contentlayerdev/contentlayer

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.