feat: 自动生成 md 文档 (#2935)

* chore(hi-ui): api文档完善

* feat: 自动生成md文档

* feat: 合并md文件

---------

Co-authored-by: xiamiao <[email protected]>

scripts/hi-docs/src/merge-docs.mjs

@@ -1,6 +1,12 @@
 import Path from 'path'
 import { heading, html, text } from 'mdast-builder'
-import { markdownRender, outputPath, writeFileAsync, cleanCreateDir } from './utils/index.mjs'
+import {
+  markdownRender,
+  outputPath,
+  writeFileAsync,
+  appendFileAsync,
+  cleanCreateDir,
+} from './utils/index.mjs'
 
 export async function mergeDocs(components) {
   // const pkgs = components
@@ -16,6 +22,9 @@ export async function mergeDocs(components) {
       // 元信息合并
       let markdown = info.readme
       markdown = mergePropsIntoReadme(markdown, info.props)
+      const markdownMd = mergeStoriesCodeIntoReadme(info.name, markdown, info.stories)
+      await writeReadmeAsync(info, markdownMd)
+      await appendReadmeAsync(info, markdownMd)
       markdown = transformJSX(markdown)
       markdown = mergeStoriesIntoReadme(info.name, markdown, info.stories)
       // 写入
@@ -68,6 +77,13 @@ function mergePropsIntoReadme(readmeMarkdown, props) {
   return readmeMarkdown.replace('<!-- Inject Props -->', propsMarkdown)
 }
 
+function mergeStoriesCodeIntoReadme(name, readmeMarkdown, stories) {
+  // console.log('mergeStories~~~~', info.name, info.stories)
+
+  const storiesMarkdown = storiesReadmeRender(name, stories)
+  return readmeMarkdown.replace('<!-- Inject Stories -->', storiesMarkdown)
+}
+
 // 转成 CodeBlock 支持的 mdx 语法格式，避免识别为 JSX
 const transformJSX = (str) => {
   return str
@@ -77,7 +93,7 @@ const transformJSX = (str) => {
 }
 
 async function writeDocs(info, markdown) {
-  await cleanCreateDir(outputPath)
+  // await cleanCreateDir(outputPath)
 
   // const dist = Path.join(outputPath, info.name)
 
@@ -96,6 +112,20 @@ async function writeDocs(info, markdown) {
   ])
 }
 
+async function writeReadmeAsync(info, markdown) {
+  await cleanCreateDir(outputPath)
+  await Promise.all([
+    // 写入markdown
+    // writeFileAsync(Path.join(outputPath, `./readme/${info.name}.md`), markdown),
+    writeFileAsync(Path.join(outputPath, 'readme', `${info.name}.md`), markdown),
+  ])
+}
+
+async function appendReadmeAsync(info, markdown) {
+  markdown = '\n\n###@###\n\n' + markdown
+  await Promise.all([appendFileAsync(Path.join(outputPath, 'hiui.md'), info.name, markdown)])
+}
+
 function storiesRender(name, stories) {
   const markdownConfig = stories.reduce((acc, storyInfo) => {
     const storyBlock = getStoryBlock(name, storyInfo)
@@ -105,6 +135,15 @@ function storiesRender(name, stories) {
   return markdownRender(markdownConfig)
 }
 
+function storiesReadmeRender(name, stories) {
+  const markdownConfig = stories.reduce((acc, storyInfo) => {
+    const storyBlock = getReadmeStoryBlock(name, storyInfo)
+    return acc.concat(storyBlock)
+  }, [])
+
+  return markdownRender(markdownConfig)
+}
+
 function getStoryBlock(name, story) {
   return [
     // CodeBlock mdx
@@ -118,6 +157,16 @@ function getStoryBlock(name, story) {
   ].filter(Boolean)
 }
 
+function getReadmeStoryBlock(name, story) {
+  const storyBlock = '\n```tsx\n' + story.content + '\n```\n'
+  return [
+    // CodeBlock mdx
+    heading(3, text(story.title)),
+    story.description ? text(story.description) : false,
+    html(storyBlock),
+  ].filter(Boolean)
+}
+
 function propsRender(props) {
   const markdownConfig = props.reduce((acc, info) => {
     const block = getPropsBlock(info)

scripts/hi-docs/src/utils/index.mjs

@@ -23,6 +23,10 @@ export const writeFileAsync = async (path, content) => {
   await FS.writeFile(path, content)
 }
 
+export const appendFileAsync = async (path, name, content) => {
+  if (name !== 'hiui') await FS.appendFile(path, content)
+}
+
 export const readFileAsync = async (path, basePath) => {
   if (basePath) {
     path = Path.join(basePath, path)