Ability to load external md files into <docs>

[FreekVR]

Clear and concise description of the problem

As a component library author I want to be able to load my existing README files into histoire, so that I can browse the documentation both inside histoire and in the repository (eg gitlab/github etc) and do not have to duplicate the docs.

Suggested solution

<docs lang="md" src="../../README.md" />

Alternative

<script setup>
import ExternalDocument from `mypackage/README.md`
</script>

<docs lang="md">
{{ ExternalDocument }}
</docs>

Additional context

It does seem like this is somewhat supported, except it throws an error right now (doesn't seem to parse as markdown)

Error while collecting story /home/freek/projects/toolkit/demo/components/Generic/Button.story.vue:
Error: Parse failure: Unexpected character ' ' (1:1)
Contents of line 1: # Hallo
    at Object.ssrTransform (/home/freek/projects/toolkit/demo/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:48653:15)
    at ViteNodeServer._transformRequest (file:///home/freek/projects/toolkit/demo/node_modules/vite-node/dist/server-d9fc65e0.js:180:36)
    at async ViteNodeServer._fetchModule (file:///home/freek/projects/toolkit/demo/node_modules/vite-node/dist/server-d9fc65e0.js:166:17)
    at async MessagePort.<anonymous> (file:///home/freek/projects/toolkit/demo/node_modules/birpc/dist/index.mjs:16:18)

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that requests the same feature to avoid creating a duplicate.

[goldengecko]

edit: I got part way through editing markdown.ts to look for a src attribute in the id and resolve and read the file etc, when I found that I can already use src to add my documentation markdown - works for me. The only thing I would add if I was updating the implementation would be to put a watcher on the file (just work out the file path from about line 123 and add a chokidar.watch on it.

I have a similar use case where I need multiple stories for a component and I want the same documentation for all of them.

I think the suggested solution would be great, or the ability to add it as an attribute on either a story or variant.

There would probably be issues with the alternative suggestion as:

• You would have problems with the import statement since md files wouldn't be recognised as modules, so you'd have to add a plugin to vite to handle the import
• Since the docs tag is outside the template, the normal handlebars notation wouldn't automatically be recognised so it would take extra implementation to add it
• Also since it's outside the template, the normal development tools would think that the import was unused and you'd get an unused variable warning if you have that turned on in the linting.

[hybridwebdev]

<docs lang="md" src="./test.md"></docs>

test.md

# Hello world

I think this issue might have been resolved in one of the updates, as this works for me. It also solves an issue I was having where the sibling markdown file pattern eg:

some.story.vue
some.story.md

was working in dev mode, but in the built version stories showed the "no documents" message related to #538.