Use outside of MDX for fetching code

[Irev-Dev]

Hello,

I have a use case where I'd like be able to fetch code from an external source and than use Code-hike to display it. So far I've only had luck with replacing sections of markdown before it's serialised by next-mdx-remote. Are there react components in Code-hike that can be used directly in jsx?

Our motivation for external code, is we want each snippet to exist in it's own file so we can also run tests on them.

[pomber]

I'll add the option to read code from the filesystem in the near future. For something more complex, if you want your approach of generating the mdx before is compiled is the way to go, you could even make a remark plugin that runs before codehike.

[Irev-Dev]

Thanks @pomber, That's useful.

[MildTomato]

Also wondering if there could be a way of using <CH.Code> directly in jsx.
Useful to use the same styling for a codeblock outside of MDX sometimes.

[pomber]

You can't use <CH.Code> in JSX. You can import a component from MDX and use it in JSX, sometimes that's enough.

[BleedingDev]

I would also love to have CodeHike usable outside of MDX. Any plans to allow it? :)

[pomber]

yes, v1 will allow it

[tomByrer]

we want each snippet to exist in it's own file so we can also run tests on them.

This is an ideal way IMHO. I've found docs' examples that didn't work because the API changed, yet they didn't test their own examples.
& helps testers be more lazy ;)

[pomber]

the snippet in it's own file is already possible with the from annotation.