Export useid was not found in React

Published Jan 10, 2023

I encountered a strange issue the other day when attempting to import the useId hook in React so that I could automatically generate the ID’s on a list I was creating.

export 'useId' (imported as 'useId') was not found in 'react'

That’s not right… I’m not doing anything special other than importing it along with my other dependencies like so:

import { useid } from 'react';

I was using React 16.x, quite a bit older than the mainline version (18.2 being the latest version at the time of publishing this article).

Searching for information about this error took me down a rabbit hole of Github issues and webpack discussions.

After trying a number of different things, the quickest solution was to simply upgrade my react dependencies to version 18.x and to upgrade my webpack versions to 5.75.x:

"react": "^18.2.0",
"react-dom": "^18.2.0",
"webpack": "^5.75.0",
"webpack-cli": "^5.0.1"

After that, I just ran a quick npm i to refresh my packages and the issue went away entirely.

If you have a better way of solving this, please let me know below in the comments!