importing and using .md files within .mdx files or CSF format files

[awacode21]

Describe the bug I have a project created by vue-cli and storybook is added by its cli plugin. Regarding this documentation: https://github.com/storybookjs/storybook/tree/master/addons/notes (see section about "Using Markdown") i should be able to import and use normal markdown files in CSF format files. Also regarding this documentation: https://mdxjs.com/getting-started#documents the transclusion of a .md file into .mdx file should be possible.

Both do not work!

i always get the error:

Within this issue: https://github.com/storybookjs/storybook/issues/7644 there are several workaround mentioned by @atanasster but none of them work!

I tried to use a custom webpack config for storybook using other loaders which can handle markdown. Then the import can be handled but i get another error:

So whatever i do, since days now, does not work. Seems to me that normal .md files are not supported the right way in storybook? Loader issue? compiler issue? Or simply me doing it wrong? No idea, i need help!

To Reproduce I created a sample project. It is nearly empty. Just created using vue-cli and added storybook via its cli plugin. I added an introduction.stories.mdx trying to import the README.md file for showcase:

https://github.com/awacode21/storybook-markdown-sample

Expected behavior I would expect that the use of normal markdown files (.md) works as documented

Screenshots See above

Code snippets See github sample

System: Environment Info:

System: OS: macOS 10.15.2 CPU: (8) x64 Intel(R) Core(TM) i7-7820HQ CPU @ 2.90GHz Binaries: Node: 13.8.0 - /usr/local/bin/node Yarn: 1.22.0 - /usr/local/bin/yarn npm: 6.14.2 - /usr/local/bin/npm Browsers: Chrome: 80.0.3987.132 Firefox: 71.0 Safari: 13.0.4 npmPackages: @storybook/addon-actions: >=5.3.0 => 5.3.14 @storybook/addon-knobs: >=5.3.0 => 5.3.14 @storybook/addon-links: >=5.3.0 => 5.3.14 @storybook/addon-notes: >=5.3.0 => 5.3.14 @storybook/vue: >=5.3.0 => 5.3.14

[awacode21]

i figured out i can work around it that way, but then it looses some of the formatting/styles it would have in the normal .md file. But for the moment it is the best solution i can find to proceed. But still, i think there is an issue because it does not work as stated in the documentation and it additionally needs custom webpack configuration to override the one which is not working.

[shilman]

Closing as duplicate to #7644