Package Exports

react-mathjax-preview-ext

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-mathjax-preview-ext) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-mathjax-preview

react-mathjax-preview provides one React component to render MathML, TeX or ASCIImath formulas. See demo.

Installation

Install react-mathjax-preview as a dependency:

npm install react-mathjax-preview

Usage

Import the package and fill the math property with some text containing your formals. Wrap TeX in $ or $$ and ASCIImath in `. Paste MathML as is.

import React, {Component} from 'react'
import {render} from 'react-dom'
import MathJax from 'react-mathjax-preview'

const asciimath = '`sum_(i=1)^n i^3=((n(n+1))/2)^2`' # Because of the backtick
const math = String.raw`
  <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
    <menclose notation="circle box">
      <mi> x </mi><mo> + </mo><mi> y </mi>
    </menclose>
  </math>

  $$\lim_{x \to \infty} \exp(-x) = 0$$

  ${asciimath}`

class Demo extends Component {
  constructor(props) {
    super(props);
    this.state = {
      math: tex
    }
  render() {
    return <MathJax math={this.state.math} />
  }
}

See demo for a complete example. You can also play with the demo:

git clone https://github.com/mehdisadeghi/react-mathjax-preview && cd react-mathjax-preview
npm install
npm run start

And browse to localhost:3000.

License

MIT