Leading whitespace in my markdown file is being lost when rendering the text in a react-markdown component.
I am reading the file as follows,
fetch(file)
.then((res) => res.text())
.then((text) => this.setState({ markdown: text }));
and the render:
const { markdown } = this.state;
return (
<Markdown
className="textblock"
children={markdown}
remarkPlugins={[remarkBreaks]}
>
)
If I have a line in the markdown file
dog
it is rendered as
dog
And if I have a line
dog
it is rendered the same,
dog
I have console log'd the 'text' variable from the first snippet (in the fetch), and can see that nbsp characters are preserved. So I think that I am using the react-markdown component wrong. It does not matter if I set the textblock
property, white-space: pre
, the whitespace has already been lost (does not exist in the react-markdown component's content).