Attempted import error: 'useSelector' is not exported from '@legendapp/state/react' (imported as 'useSelector').

[tendertree]

Attempted import error: 'useSelector' is not exported from '@legendapp/state/react' (imported as 'useSelector')

import { observable } from "@legendapp/state";
import { enableReactTracking } from "@legendapp/state/config/enableReactTracking";

enableReactTracking({
	auto: true,
});
const name$ = observable({ name: "kim", age: 5 });
export default function Home() {
	const name = name$.name.get();
	return (
		<div> {name} </div>
	)
}

I try to add

import { useSelector } from "@legendapp/state/react"

but error still show

currently "@legendapp/state": "^2.1.2" is installed

[jmeistrich]

Is this in Next.js 14? Maybe it's the same cause as #221?

[jmeistrich]

I tried updating to Next.js 14 and couldn't reproduce any problems. Could you tell me more about your environment? Was it working before you changed something?

[michaelzadra1]

For me, this is easily reproducible by upgrading Next from version 14.0.1, to 14.0.2

[jmeistrich]

It seems to be caused by vercel/next.js#57784 and some others are reporting the same issue. I'll investigate further, but for now I guess stay on 14.0.1?

I guess it's not breaking for my tests because we use SSG and it's an SSR specific issue?

[tendertree]

try to change next versioon 14.0.1 and it worked out of box
(previously I forgot to add "use client") but 14.0.2 has conflict

[Tekutorukushi]

Any solutions? We need something to work with NextJs 14.0.2

[jmeistrich]

I'm not sure what the problem even is so I'm not sure how to solve it. It seems to be a bug in Next because it works in every other environment and it's worked in Next up until the update broke it. Multiple packages seem to be having the same problem so I think it's not a legend-state bug?

Can you try posting an issue in the Next.js repo? Or if you can track down the issue and attempt a fix or guide me on where to start, it would be a huge help.

[jacktsin1]

Same here, I'm getting similar errors:
Attempted import error: 'Show' is not exported from '@legendapp/state/react' (imported as 'Show').
Attempted import error: 'useSelector' is not exported from '@legendapp/state/react' (imported as 'useSelector').

[DawidWraga]

any updates on this?

[jmeistrich]

Some say it may be fixed in the next update, which would be 14.0.4. I've never reproduced it myself so I'm not 100% sure if their fix will actually fix this.

[wslp12]

Someone has to proceed with the test with the canary version. (https://www.npmjs.com/package/next?activeTab=versions )
Perhaps if anyone wants to solve it here, I recommend you try it yourself.

I had the same issue and the issue disappeared in that canary.

I don't know if this will apply to anyone else as well.

[Tekutorukushi]

I checked it on v14.0.4-canary.44, it was fixed, now everything works for me.

[mariuszubryt]

I can confirm that upgrading Next to 14.0.4 solved the same error for us during the build process.