javascript - Attempted import error: 'uuid' does not contain a default export (imported as 'uuid') In React

Question

Error is :Attempted import error: 'uuid' does not contain a default export (imported as 'uuid')

This is the Code Sample

import uuid from "uuid";
//import * as uuid from "uuid";
import TodoInput from "./components/TodoInput";
import TodoList from "./components/TodoList";

export default class App extends Component {
state = {
  items: [
    { id: 1, title: "wake up" },
    { id: 2, title: "make breakfast" }
  ],
  id: uuid(),
  item: "",
  editItem: false
};
....
....

What Could be the Reason Behind This?

question from:https://stackoverflow.com/questions/60830848/attempted-import-error-uuid-does-not-contain-a-default-export-imported-as-u

Answer 1

Because the uuid package has not default export, as the error clearly states.

(it used to exist, but has been removed)

Once installed, decide which type of UUID you need. RFC4122 provides for four versions, all of which are supported here.

(documentation at https://www.npmjs.com/package/uuid)

so you need to choose one of the following

import {v1 as uuid} from "uuid"; 
// import {v3 as uuid} from "uuid"; 
// import {v4 as uuid} from "uuid"; 
// import {v5 as uuid} from "uuid"; 

depending on the implementation you want.

---

If you are using an older version of the package you could use one of

import uuid from 'uuid/v1'
// import uuid from 'uuid/v3'
// import uuid from 'uuid/v4'
// import uuid from 'uuid/v5'