Astro + solid-query fails to parse imports

[kollinmurphy]

Describe the bug

I'm using version 1.5.2 of astro, version 1.6.0 of solid-js, and version 4.12.0 of solid-query. I'm completely unable to get them to work together. First, I got an error saying that React was undefined somewhere inside of solid-query. That was fixed with a vite config, but this other error is more stubborn. This is the error:

Failed to parse source for import analysis because the content contains invalid JS syntax. If you are using JSX, make sure to name the file with the .jsx or .tsx extension.

/astro-solid-query/node_modules/@tanstack/solid-query/build/solid/QueryClientProvider.jsx:40:37
38 |        <QueryClientContext.Provider value={mergedProps.client}>
39 |          {mergedProps.children}
40 |        </QueryClientContext.Provider>
   |                                      ^
41 |      </QueryClientSharingContext.Provider>);
42 |  };

Your minimal, reproducible example

https://github.com/kollinmurphy/astro-solid-query-bug

Steps to reproduce

1. Clone the minimal example repository
2. Install & run server
3. Open in browser

Expected behavior

As a user, I expect solid-query to work within an Astro envrionment.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: Linux
• Browser: Chrome

react-query version

v4.12.0

TypeScript version

v4.8.4

Additional context

No response

[Morialkar]

I get the same issue in a pure Solid environment, using the Vite template.

Edit: Forcing vite-plugin-solid to version 2.3.8 solved my issue without having to manually patch the vite config. Maybe try to see if you can force the astro solid deps to resolve that version of vite-solid-plugin

[kollinmurphy]

That fix doesn't work for me because my environment isn't using vite-plugin-solid.

[lukeshafer]

Also having the same problem, in Astro as well.

Solid query version: 4.15.1 Astro version: 1.6.11 @astrojs/solid-js: 1.2.3

[lukeshafer]

Update: after messing with things a bit, I do have solid query working in astro now. I removed a Context provider that was surrounding my QueryClientProvider, since I realized I didn't need the context anymore for what I was doing. After that, the Query Client started working. No idea if that was the fix for sure because I made a lot of other little changes, but I just wanted to add this note!

[VdustR]

I encountered a similar issue with the Vite Solid template. This is due to esbuild transforming JSX to React during the optimizeDeps process. To resolve this, I excluded it by adding the following lines of code to vite.config.ts:

+ optimizeDeps: {
+   exclude: ["@tanstack/solid-query"],
+ },

[TkDodo]

@ardeora is this still an issue? I'm inclined to close this for housekeeping, as its pretty stale and there seems to be a workaround. Please re-open is there's something tangible we can / should do. Thanks