Use npm uuid in reactjs

Question

I have a place wherein I am required to use npm uuid package for generating unique Id's. After installing uuid package, the usage is as follows:

const uuid = require('uuid/v1');
uuid();

But I have error which says:

[eslint] Unexpected require(). (global-require)

My function is as below:

someFunction = (i, event) => {
   if(someCondition) {
       //generate some unique id
       const uuid1 = require('uuid/v1');
       uuid1();
       //call some function and pass this id
       someFunction2(uuid1);
    } else{ 
      //generate some unique id
       const uuid2 = require('uuid/v1');
       uuid2();
       //call some function and pass this id
       someFunction2(uuid2);
    }

What is the best way to use require in ReactJs.

Answer 1

Try this:

import React from "react";
import ReactDOM from "react-dom";
import uuid from "uuid";

function App() {
  return (
    <div className="App">
      <h1>{uuid.v4()}</h1>
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

This is a working example: https://codesandbox.io/s/0pr5vz48kv