withastro / adapters

Home for Astro's core maintained adapters
64 stars 33 forks source link

Cloudflare v10.0.0 Breaks Solid.js Build #209

Closed MehrdadKhnzd closed 6 months ago

MehrdadKhnzd commented 6 months ago

Astro Info

Astro                    v4.5.12
Node                     v20.11.1
System                   Linux (x64)
Package Manager          bun
Output                   server
Adapter                  @astrojs/cloudflare
Integrations             unocss
                         @astrojs/solid-js
                         @swup/astro
                         @vite-pwa/astro-integration

Describe the Bug

I wasn't using v9 because of the route generation bug. Today I finally migrated to v10, but it broke something else. Whenever I build the project, the server is built successfully, but when it wants to build the client (I'm using Solid.js), it throws a strange error:

Error when using sourcemap for reporting an error: Can't resolve original location of error.
[vite] ✓ 148 modules transformed.
[ERROR] [vite] x Build failed in ...
"template" is not exported by "node_modules/solid-js/web/dist/server.js", imported by ...
file: ...
1: import { template as _$template } from "solid-js/web";
            ^
...

As you see, this error is from the compiled Solid.js code, not my source code. I tried changing the order of integrations and removing other integrations to see if it solves the issue, but it didn't. The only thing that solved the issue (on a surface level) was to remove solid() integration itself from the Astro config. Surprisingly, the build was successful and it didn't throw any errors, but obviously, none of the pages work. When I roll Cloudflare adapter back to 8.1.0, it works and builds the project normally.

What's the expected result?

To properly build the project without any errors.

Link to Minimal Reproducible Example

Unfortunately, similar to the routes problem I had with v9, I couldn't reproduce it on a minimal setup given all the configurations I added.

Participation

alexanderniebuhr commented 6 months ago

Thanks for reporting this! I would love to investigate this and debug this for you! But I can't reproduce it. We need to figure out why this happens! I really want you to have a good experience on v10.

Can you share the project where it occurs? Also the error states some template import from solid, are you doing something like that with solid.

alexanderniebuhr commented 6 months ago

One quick idea, could it be that your solid related packages are not updated to the latest version?

AkashRajpurohit commented 6 months ago

@alexanderniebuhr facing the same issue, Here are the solidjs related packages

Both seems to be on the latest version, however upgrading cloudflare adapter to v10 breaks the build for me as well.

Edit: Downgraded to v9.2.0 (previous version that I was on) and build seems to be passed on this.

AkashRajpurohit commented 6 months ago

Here's a repro if this helps @alexanderniebuhr

https://stackblitz.com/edit/withastro-astro-3lrbke?file=src%2Fcomponents%2FText.tsx

Some insights while creating the repro, this fails specifically only when you import a solid component with client:* directive, if you use it without it, it builds fine but as soon as you add any directive (even client:only) it fails to build with the above-mentioned error.

twodft commented 6 months ago

I have the same issue after updating to v10,

[ERROR] [vite] x Build failed in 14.02s
src/constants/common-icons.jsx (1:9): "template" is not exported by "node_modules/.pnpm/solid-js@1.8.16/node_modules/solid-js/web/dist/server.js", imported by "src/constants/common-icons.jsx".
file: D:/projects/website/src/constants/common-icons.jsx:1:9
1: import { template as _$template } from "solid-js/web";
            ^
2: import { spread as _$spread } from "solid-js/web";
3: var _tmpl$ = /* @__PURE__ */ _$template(`<svg class="ml-2 h-3 w-3"fill=currentColor viewBox="0 0 20 20"xmlns=http://w...

already config multiple JSX frameworks as https://docs.astro.build/en/guides/integrations-guide/solid-js/#options

alexanderniebuhr commented 6 months ago

Thank you. I can now reproduce it and will work on a fix!

alexanderniebuhr commented 6 months ago

@MehrdadKhnzd @AkashRajpurohit @twodft can you try @astrojs/cloudflare@0.0.0-cf-10-solid-20240329084913 and let me know if it is fixed?

AkashRajpurohit commented 6 months ago

@alexanderniebuhr it seems to be fixed, but I had to change all client directives to client:only, even with client:idle it fails to build. Maybe its related to this or not, but with just client:only build seems to be working fine.

alexanderniebuhr commented 6 months ago

It works for me with another component for client:load & client:idle. Not sure what the issue is with your example 🤔

rasco commented 5 months ago

@alexanderniebuhr it seems to be fixed, but I had to change all client directives to client:only, even with client:idle it fails to build. Maybe its related to this or not, but with just client:only build seems to be working fine.

same here. i can only get solidjs components to load when using client:only. if i try SSR, cloudflare throws this runtime error: Cannot set properties of undefined (setting 'noHydrate')

"@astrojs/cloudflare": "^10.1.0", "@astrojs/solid-js": "^4.1.0", "solid-js": "^1.8.16",

EskelCz commented 4 months ago

I'm seeing similar issues with v10 with client:load islands (svelte). The chunking seems broken, mixing up front-end and back-end code.