Error: Element type is invalid

[PeterTF656]

First of all, thank you, developers, for making this awesome tool! I am using reactjs and running into some problems when trying to integrate this tool.

This is my jsme.js:

import React, { Component } from 'react
import Jsme from 'jsme-react'

    export default class Drawer extends Component {
        logSmiles(smiles) {
          console.log(smiles)
        }

        render () {
          return (
            <div>
              <Jsme height="300px" width="400px" options="oldlook,star"  onChange={this.logSmiles}/>
            </div>
          )
        }
      }

and then I imported this component into another page:

...
import Drawer from "../components/JSME/jsme.js"
...
...
render (
...
<Drawer/>)

Then I received this error: Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of Drawer.

and:

112 | const preferDefault = m => (m && m.default) || m
  113 | let Root = preferDefault(require(`./root`))
  114 | domReady(() => {
**> 115 |   renderer(<Root />, rootElement, () => {**
  116 |     apiRunner(`onInitialClientRender`)
  117 |   })
  118 | })

I really appreciate some help! Thank you!

[danyx23]

I think the import statement is wrong - try this:

import {  Jsme } from 'jsme-react' 

Does that fix the issue?

[PeterTF656]

Yes! That fixed it!