Add "exports" field to use-sync-external-store's package.json

[latin-1]

Summary

How did you test this change?

[gaearon]

doesn't this also need ./ and ./package.json?

[latin-1]

Oops, it appears I overlooked something. Updated.

[latin-1]

I'm not sure if "./src/*": "./src/*" is necessary for this package. Should I include that in the package.json as well?

[acdlite]

What's the motivation for this?

[sachinraja]

This would help support React Native and be esm compliant. In TanStack/query#3582 RN support was broken because we imported from use-sync-external-store/shim/index.js to support esm which does not support directory imports and must use extensions. With this PR we can import from use-sync-external-store/shim which would work correctly for esm and RN.

[TkDodo]

@gaearon @acdlite I think this PR would fix our issues we have over in react-query with the uSES shim for react native. apollo-client is having the same issue, and they have opted to copy over the uSES code to fix it on their side. I would rather wait for an official fix on your end, which I think this PR provides :)

[SimenB]

thoughts on

Suggested change

	"./shim": "./shim/index.js",
	"./shim": {
	"react-native": "./shim/index.native.js",
	"default": "./shim/index.js"
	},

?

That way all code can just be use-sync-external-store/shim.

note that this relies on the bundler actually supporting exports and supplying react-native condition (which I'm guessing metro at least doesn't do), but it seems more future-proof than these (seemingly) somewhat random exports

[latin-1]

facebook/metro#670
Metro doesn't respect exports field at all.

[SimenB]

Right, so no issue.

This stanza should still work for any modern bundler, and metro whenever it enters the future

[eps1lon]

There's Repack to consider (basically Webpack for react-native) so we might as well get this in now. Doing it in the future might be considered another breaking change.

[latin-1]

I had to say this would be a breaking change, though. That's why I held this PR. I'm trying to find out a better approach but with no luck.

[gaearon]

@latin-1 What makes this a breaking change?

[sachinraja]

@gaearon You can no longer import with extensions and some paths have changed (for ESM resolution):

use-sync-external-store/index.js -> use-sync-external-store
use-sync-external-store/shim/index.js -> use-sync-external-store/shim
use-sync-external-store/with-selector.js -> use-sync-external-store/with-selector

We may be able to support it by just exporting everything under the same path as before (maybe using glob exports).

[TkDodo]

@sachinraja @gaearon @latin-1 what's the status of this PR? If the change are okay, could we release it as a new major version? We are still having troubles with the uSES shim in react-native because of it. Thanks 🙏

[eps1lon]

We are still having troubles with the uSES shim in react-native because of it. Thanks pray

Don't we need #24440 (comment) for that?

[eps1lon]

Wouldn't this require changing the publish script? The latest version of uSES publishes no src folder (see https://unpkg.com/browse/[email protected]/). What are you currently importing with use-sync-external-store/src/??

[latin-1]

It seems that the react package has this line.

react/packages/react/package.json

Line 30 in 3613284

"./src/*": "./src/*"

[eps1lon]

This file is used internally. The published entrypoints are in npm/ which can continue using relative imports.

[eps1lon]

Alternate that's not exposing non-existent src and tested: #25231

[latin-1]

Closing in favor of #25231