immerjs / use-immer

Use immer to drive state with a React hooks
MIT License
4.04k stars 92 forks source link

Target ESM over CommonJS #117

Closed kasparkallas closed 4 months ago

kasparkallas commented 1 year ago

Currently the module target is set as CommonJS.

Nowadays ESM is a lower common denominator than CommonJS as it's supported in both Node and browser runtimes.

I have a pure ESM library which I serve unbundled (only tsc output) and the usage of the use-immer's require causes some trouble.

mweststrate commented 1 year ago

PR welcome

irishcarbomb777 commented 1 year ago

I just ran into this issue also. I solved it by setting {"type": "module"} in the package.json for node_modules/use-immer (In other words for anyone else with the issue, add that line to the package.json of the installed use-immer package within the node_modules folder). I've never had an issue with the package until building a react-based 'ink' cli tool for node.

Seize-cf commented 11 months ago

It appears that microbundle may not have a dependency on tsconfig.json. Perhaps changing the module to ESNext could potentially solve the issue.

119

k1sul1 commented 7 months ago

PR welcome

The way I see it, there's 2 PRs open regarding this. I don't know or care if they work to solve the problem, but I see that they don't have any comments or any signs life really.

I will not be making a 3rd just to also get ignored.

I just ran into this issue also. I solved it by setting {"type": "module"} in the package.json for node_modules/use-immer (In other words for anyone else with the issue, add that line to the package.json of the installed use-immer package within the node_modules folder). I've never had an issue with the package until building a react-based 'ink' cli tool for node.

Thanks for this. Simply adding "module": true to the package.json in node_modules/use-immer and then rebuilding did the trick.

Went from this error

import { useImmerReducer } from "use-immer";
         ^^^^^^^^^^^^^^^
SyntaxError: Named export 'useImmerReducer' not found. The requested module 'use-immer' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'use-immer';
const { useImmerReducer } = pkg;

    at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
    at ModuleJob.run (node:internal/modules/esm/module_job:190:5)

to no error in 2 minutes.

I'm using this on top of a Remix 2.8 project, FWIW. We tried to migrate to ESM almost six months ago. We failed, because of this package. It was the only dependency that did not play well with ESM. Now we're in a situation where we can't keep using CJS as we're migrating to Vite.

I have fixed the problem for now using patch-package, but I guess I'm off to finding another solution, since useImmer is unusable in 2024, and displays no signs of that changing.

I'm fine with this solution. I just find it kinda sad that I have to do this.

wget -O hooks/useImmer.ts https://raw.githubusercontent.com/immerjs/use-immer/master/src/index.ts
atsolberg commented 5 months ago

@k1sul1 I was able to fix this by telling remix to bundle it with the server: image

I love immer and I hope this package gets some ESM love someday. Thank you @mweststrate for all your hard work over the years!

mweststrate commented 4 months ago

Hopefully fixed with 0.10.0, see #122 by @fedemp. Give it a try (usually ESM conversions break somewhere in my experience :-P)