import and render md file in react-native

user_2707984 0
Viewed 826

I have a few md files that I want to render in a react-native app. The problem is that when I try to import them (using import or require), I always get this error:

error: bundling failed: Error: Unable to resolve module

so I don't see how I can import an md file in order to render it (using probably a library like marked or react-markdown.

react-native markdown
1 Answers

If you don't have many files, the best option is to convert them to template literals, and to .js files, something like so:

Initial: example.md

# markdown
something else

Final: example.js

const example = `# markdown
something else
`;
export default example;

and then, you would be able to use, for example, react-native-simple-markdown to render it like so:

<SimpleMarkdown>
    {example}
</SimpleMarkdown>

Even if there are many files, if they will already be bundled with the app, you can set up a script, or maybe a gulp task, to convert them before building the app.

However, if the user will be uploading these files, or you don't like this solution, there might be another way, either accessing the file system or using a local website inside the app.

user_71900710
Related