0

I am converting an Astro app to Sveltekit that's hosted on Cloudflare pages. The local dev and builds work fine however on deploy the Tailwind styling isn't applying. The classes are in the html but without any css actually applied.

Loading module from “https://bc853ba5.altov2.pages.dev/_app/immutable/start-75c8c80e.js” was blocked because of a disallowed MIME type (“text/html”).   
   
Loading failed for the module with source “https://bc853ba5.altov2.pages.dev/_app/immutable/start-75c8c80e.js”.

console logs

The above picture is the console output on the deployment. I have my personal website hosted with Sveltekit on Cloudflare Pages and didn't have any problems. So the possible reasons I can think of is that this app is a monorepo app but the app works fine just has no css. Although I think there's some issue with reaching the app.css file.

Some other points that might matter

  • I have vitest and playwright set up from the initial project creation but there's no tests actually made for them.
  • I'm using the @sveltejs/cloudflare-adapter. I am also using +page.server.ts files to load data but I don't see why that would affect the styling

Any help would be great thanks!

michecode
  • 85
  • 5

1 Answers1

1

I ran into the same issue today on an existing project. I bumped down the package version of the Cloudflare adapter:

"@sveltejs/adapter-cloudflare": "^1.1.0"

This solved it for me.

Zach Jensz
  • 3,650
  • 5
  • 15
  • 30
Hessel
  • 26
  • 1