You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Running vite build in a project that includes a library, with components exported as "use client" directives, causes warnings to be shown in the build log.
E.g. adding the @tanstack/react-query library:
odule level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useQuery.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/QueryClientProvider.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/Hydrate.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/QueryErrorResetBoundary.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useIsFetching.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useIsMutating.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useMutation.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useInfiniteQuery.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/isRestoring.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/reactBatchedUpdates.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useSyncExternalStore.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/errorBoundaryUtils.mjs" was ignored.
Module level directives cause errors when bundled, "use client" in "node_modules/@tanstack/react-query/build/lib/useBaseQuery.mjs" was ignored.
There's nothing the user of a library can do to remove these warnings. More and more libraries are going implement the "use client", as users start using React Server Components.
I think Vite should make a decision on how to handle these, so they don't surface to user.
It can be "solved" by ignoring the warning - I'm thinking this could be added directly to the react plugin?
With Storybook 7 adding support for using Vite, people that migrate to that - even if otherwise using Webpack/Next.js - Will also start to see those warnings.
Describe the bug
Running
vite build
in a project that includes a library, with components exported as"use client"
directives, causes warnings to be shown in the build log.E.g. adding the
@tanstack/react-query
library:There's nothing the user of a library can do to remove these warnings. More and more libraries are going implement the
"use client"
, as users start using React Server Components.I think Vite should make a decision on how to handle these, so they don't surface to user.
It can be "solved" by ignoring the warning - I'm thinking this could be added directly to the react plugin?
See the following for more information on RSC and the issue:
use client
directive with Vite TanStack/query#5175With Storybook 7 adding support for using Vite, people that migrate to that - even if otherwise using Webpack/Next.js - Will also start to see those warnings.
Reproduction
https://stackblitz.com/edit/vitejs-vite-nekn76?file=src%2FApp.jsx&terminal=dev
Steps to reproduce
Run
npm run build
to trigger the buildSystem Info
Used Package Manager
npm
Logs
No response
Validations
The text was updated successfully, but these errors were encountered: