Blank page when importing package

Hi there, this is just the standard App.js file that is initiliazed to which I imported the Avvvatars package. When I save the code and refresh the page, it turns blank (so no rendering). Note that I’m just importing the package and not using it either.

import logo from './logo.svg';
import './App.css';
import Avvvatars from 'avvvatars-react';

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a
          className="App-link"
          href="https://reactjs.org"
          target="_blank"
          rel="noopener noreferrer"
        >
          Learn React
        </a>
        <p>
          
        </p>
      </header>
    </div>
  );
}

export default App;

I checked whether the package has been properly installed and it’s appearing in package.json too.

[ouhzzzman]

You’re right, this is the error I’m getting from the console

Uncaught TypeError: goober.styled is not a function
    at Object../node_modules/avvvatars-react/dist/avvvatars-react.cjs.development.js (Shape.tsx:18:1)
    at Object.options.factory (react refresh:6:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:61:1)
    at Object../node_modules/avvvatars-react/dist/index.js (index.js:7:1)
    at Object.options.factory (react refresh:6:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:61:1)
    at Module../src/App.js (logo.svg:34:1)
    at Module.options.factory (react refresh:6:1)

[nusu]

Thanks for letting me know, I’ve managed to reproduce it and fixed it with #7, you can install latest version and let me know if it works.