title: Attempted import error, failed to compile react app
body: <p>I am getting the following error and would love it if someone could point me in the right direction :)
  I've tried different ways but nothing works.</p>
  
  <blockquote>
    <p>Failed to compile
    ./src/App.jsx
    Attempted import error: 'eval' is not exported from 'mathjs' (imported as 'math').</p>
  </blockquote>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import React, { Component } from 'react';
  import './App.css';
  import { Button } from './components/Button';
  import { Input } from './components/Input';
  import { ClearButton } from './components/ClearButton';
  import * as math from 'mathjs';
  
  class App extends Component {
    constructor(props) {
      super(props);
  
      this.state = {
        input: ""
      };
    }
  
    addToInput = val =&gt; {
      this.setState({input: this.state.input + val});
    }
  
    handleEqual = () =&gt; {
      this.setState({input: math.eval(this.state.input)});
    }
  
    render() {
      return (
        &lt;div className="app"&gt;
          &lt;div className="calc-wrapper"&gt;
            &lt;Input input={this.state.input}&gt;&lt;/Input&gt;
            &lt;div className="row"&gt;
              &lt;Button handleClick={this.addToInput}&gt;7&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;8&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;9&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;/&lt;/Button&gt;
            &lt;/div&gt;
            &lt;div className="row"&gt;
              &lt;Button handleClick={this.addToInput}&gt;4&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;5&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;6&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;X&lt;/Button&gt;
            &lt;/div&gt;
            &lt;div className="row"&gt;
              &lt;Button handleClick={this.addToInput}&gt;1&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;2&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;3&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;+&lt;/Button&gt;
            &lt;/div&gt;
            &lt;div className="row"&gt;
              &lt;Button handleClick={this.addToInput}&gt;.&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;0&lt;/Button&gt;
              &lt;Button handleClick={() =&gt; this.handleEqual()}&gt;=&lt;/Button&gt;
              &lt;Button handleClick={this.addToInput}&gt;-&lt;/Button&gt;
            &lt;/div&gt;
            &lt;div className="row"&gt;
                &lt;ClearButton handleClear={ () =&gt; this.setState({input: "" })}&gt;Clear&lt;/ClearButton&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      );
    }
  }
  export default App;</code></pre>
  </div>
  </div>
  </p>