wko27 / react-mathjax

MathJax as React component
MIT License
168 stars 71 forks source link

Cannot render markdown while using library with ReactMarkdown #15

Open seppar93 opened 4 years ago

seppar93 commented 4 years ago

Currently, my application uses the ReactMarkdown package to display my text and I've tried to embed my it with mathjax however cannot have everything displayed properly. also using import RemarkMathPlugin from 'remark-math' to parse math from text


    ...props,
    plugins: [RemarkMathPlugin],
    renderers: {
      ...props.renderers,
      math: props => <MathJax.Text inline />,
      inlineMath: props => <MathJax.Text inline />
    }
  };
  return (
    <div className='QDocMarkdownComponent'>
      <MathJax.Context
        input='ascii'
        onLoad={() => console.log('Loaded MathJax script!')}
        onError={(MathJax, error) => {
          console.warn(error);
          console.log('Encountered a MathJax error, re-attempting a typeset!');
          MathJax.Hub.Queue(MathJax.Hub.Typeset());
        }}
        script='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=AM_HTMLorMML'
        options={{
          asciimath2jax: {
            useMathMLspacing: true,
            delimiters: [['$$', '$$']],
            preview: 'none'
          }
        }}>
        <ReactMarkdown escapeHtml={false} {...newProps} />
      </MathJax.Context>
    </div>
  );```
ProfessorX737 commented 4 years ago

Try

math: props => <MathJax.Node>{props.value}</MathJax.Node>,
inlineMath: props => <MathJax.Node inline>{props.value}</MathJax.Node>,