on the Nesting Problem of MD Files

[Lost-genban]

├─ docs
│  ├─ .vitepress 
│  ├─ B.md
│  ├─ A.md
│  └─ index.md
└─ package.json

In the index.md file, the code is as follows, and it uses the include nesting syntax with two Markdown files.

<!--@include: B.md-->

<!--@include: A.md-->

In the A.md file,
A.md contains a <script setup> block.

<script setup>
    // Your code here
</script>

B.md also contains a <script setup> block.

<script setup>
    // Your code here
</script>

This will result in an error:

[plugin:vite:vue] Single file component can contain only one <script setup> element

The error occurs because you should have only one <script setup> block in each Markdown file.

What is the issue with this? My intention is to split a single Markdown file into multiple Markdown files to reduce the code volume in a single file and make it easier to locate specific sections of code.

[brc-dd]

What is the issue with this?

Vue can't handle multiple script blocks. Import those markdown files instead of including them if you want to keep script blocks in separate files.

[Lost-genban]

thank u, I thought that nesting here would be in the form of Vue components, where two <script setup> blocks in separate md files called by another md file wouldn't cause any issues.
This is because they are not written in the same Markdown file; they are simply included using the <!--@include:xxxx> syntax.

If it were a nested structure where all script blocks needed to be encapsulated into one, it would be a bit cumbersome.

[brc-dd]

Like I said, you can "import" them if you want them to behave like vue components. Refer this example - https://stackblitz.com/edit/vite-sclc3e?file=docs/b.md,docs/a.md,docs/index.md

[Lost-genban]

This is a good solution,Why didn't I think of this solution? thank u