Devtools error/crashing with NextJS 14.1

[mnpqraven]

NextJS version ^14.1 will break devtools with the following error when you click on the atom viewer

Here is the minimal reproducible repo: https://github.com/mnpqraven/jotai-repro A workaround for now is to use 14.0.x, I'm using 14.0.2 for my projects and they seem to work fine

[arjunvegda]

Thanks a lot for the repro!

Removing swcPlugins from the next.config.mjs gets rid of the error within the DevTools. I still see (0 , jotai__WEBPACK_IMPORTED_MODULE_2__.useAtomValue) is not a function 🤔

- swcPlugins: [
-   ["@swc-jotai/debug-label", {}],
-   ["@swc-jotai/react-refresh", {}],
- ],

[arjunvegda]

Adding 'use client'; at the top of Page.tsx (on top of removing swcPlugins from next.config.mjs) fixes the issue. I'm not sure if this is ideal but should unblock you for now

(You might want to delete the .next folder after making these changes.)

[huraim]

@arjunvegda

Thank you! I tried applying as you mentioned, and it seems to work. I still want to use version 14.1 without downgrading. It's a shame that I can't use the features of https://jotai.org/docs/tools/swc... For now, I'll have to apply debugLabel directly.

1. Remove swcPlugins
2. Remove .next
3. Restart
4. Write `debugLabel`

[huraim]

Instead of adding 'use client'; at the top of Page.tsx, I recommend creating a separate JotaiDevtool component and adding 'use client'; at the top of the JotaiDevtool.tsx.

[arjunvegda]

For now, I'll have to apply debugLabel directly.

@huraim - could you try using our babel plugins?

[huraim]

@arjunvegda - I was using swc before the migration, so I missed that. I'll try applying babel. Thank you for the suggestion.

[mnpqraven]

hmm I'm trying to apply said changes to my current project to bump next to 14.1 and while the errors are gone, the devtools are not detecting any atom (even though it does in the reproduction repo, weird)

EDIT: now it works without any changes, idk what happens.. EDIT2: it's no longer working again, I think this might have something to do with possibly the provider or NextJS, i'll try to reproduce this

[arjunvegda]

The latest version of NextJS appears to have fixed this issue. Please feel free to reopen if you're still experiencing this problem