fix(build): resolve nested md inclusions properly

closes #2584
closes #2586
Co-authored-by: Jeff Tian <[email protected]>

Author: brc-dd

Diff for: __tests__/e2e/markdown-extensions/markdown-extensions.test.ts

@@ -65,7 +65,7 @@ describe('Table of Contents', () => {
   test('render toc', async () => {
     const items = page.locator('#table-of-contents + nav ul li')
     const count = await items.count()
-    expect(count).toBe(33)
+    expect(count).toBe(35)
   })
 })
 
@@ -242,6 +242,15 @@ describe('Markdown File Inclusion', () => {
     expect(await h1.getAttribute('id')).toBe('foo-1')
   })
 
+  test('render markdown using nested inclusion inside sub folder', async () => {
+    const h1 = page.locator('#after-foo + h1')
+    expect(await h1.getAttribute('id')).toBe('inside-sub-folder')
+    const h2 = page.locator('#after-foo + h1 + h2')
+    expect(await h2.getAttribute('id')).toBe('sub-sub')
+    const h3 = page.locator('#after-foo + h1 + h2 + h3')
+    expect(await h3.getAttribute('id')).toBe('sub-sub-sub')
+  })
+
   test('support selecting range', async () => {
     const h2 = page.locator('#markdown-file-inclusion-with-range + h2')
     expect(trim(await h2.textContent())).toBe('Region')

Diff for: __tests__/e2e/markdown-extensions/nested-include.md

@@ -1,3 +1,5 @@
 <!--@include: ./foo.md-->
 
 ### After Foo
+
+<!--@include: ./subfolder/inside-subfolder.md-->

Diff for: __tests__/e2e/markdown-extensions/subfolder/inside-subfolder.md

@@ -0,0 +1,3 @@
+# Inside sub folder
+
+<!--@include: ./subsub/subsub.md-->

Diff for: __tests__/e2e/markdown-extensions/subfolder/subsub/subsub.md

@@ -0,0 +1,3 @@
+## Sub sub
+
+<!--@include: ./subsubsub/subsubsub.md-->

Diff for: __tests__/e2e/markdown-extensions/subfolder/subsub/subsubsub/subsubsub.md

@@ -0,0 +1 @@
+### Sub sub sub

Diff for: src/node/markdownToVue.ts

@@ -90,7 +90,7 @@ export async function createMarkdownToVueRenderFn(
     // resolve includes
     let includes: string[] = []
 
-    function processIncludes(src: string): string {
+    function processIncludes(src: string, file: string): string {
       return src.replace(includesRE, (m: string, m1: string) => {
         if (!m1.length) return m
 
@@ -100,7 +100,7 @@ export async function createMarkdownToVueRenderFn(
         try {
           const includePath = atPresent
             ? path.join(srcDir, m1.slice(m1[1] === '/' ? 2 : 1))
-            : path.join(path.dirname(fileOrig), m1)
+            : path.join(path.dirname(file), m1)
           let content = fs.readFileSync(includePath, 'utf-8')
           if (range) {
             const [, startLine, endLine] = range
@@ -114,14 +114,14 @@ export async function createMarkdownToVueRenderFn(
           }
           includes.push(slash(includePath))
           // recursively process includes in the content
-          return processIncludes(content)
+          return processIncludes(content, includePath)
         } catch (error) {
           return m // silently ignore error if file is not present
         }
       })
     }
 
-    src = processIncludes(src)
+    src = processIncludes(src, fileOrig)
 
     // reset env before render
     const env: MarkdownEnv = {