api-console with react

[FranciscoGileno]

Hi!

Congrats for this lib. It is great!

I am trying to make it run with a new instance of create-react-app. I already installed the package npm -i --save api-console, and my code is:

import "api-console";

import "./App.css";

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <api-console
          style={{ height: "400px" }}
          modelLocation="/api-model.json"
        />
      </header>
    </div>
  );
}

export default App;

I've got: Uncaught SyntaxError: Identifier 'module' has already been declared

It seems create-react-app and api-console both declared module?

Can anyone help me? Thanks.

[jarrodek]

Hi,

Thank you for the issue report. I am not expert in react but I believe you should have reference the component registration file which is api-console/api-console.js so the final import would be:

import 'api-console/api-console.js';

There's no module in this project that would cause this error. If this won't help I'll ask @TwoPlusTwoOne to help you as he has more experience with React

[FranciscoGileno]

Thanks for answering @jarrodek .

It didn't work. Same error.

[jarrodek]

I see the problem. The icons library has an icon that is called module. It exports a variable with that name. After webpack compilation there is a function argument called module and then const declaration with the same name. This causes SyntaxError. I though webpack is smarter than that. I can actually change the name of the icon as it is not yet widely used but it will take time.