solid-start icon indicating copy to clipboard operation
solid-start copied to clipboard

[Bug?]: CSS is not applied on build when Vite `build.cssCodeSplit: false` option is used

Open TrentsPC opened this issue 1 year ago • 1 comments

Duplicates

  • [X] I have searched the existing issues

Latest version

  • [X] I have tested the latest version

Current behavior 😯

After building an app with cssCodeSplit: false, a bundled and hashed CSS file is correctly created in the output, but the CSS file is not linked to or referenced by any file in the output.

Expected behavior 🤔

The CSS file should be linked on all routes, as if it were included as a <link/> in entry-server.tsx

Steps to reproduce 🕹

Steps:

  1. Create a SolidStart app using create solid with the basic preset
  2. Update vite.config.ts to:
import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  build: {
    cssCodeSplit: false,
  },
});
  1. Run the build script
  2. observe that the generated .output/public/_build/assets/style-[hash].css file is not referenced in any generated html or js file

Context 🔦

I am styling my app by importing different css files on different routes, and I would like to have the option of using cssCodeSplit: false to combine them all and avoid loading new CSS on navigation and causing unnecessary repaints / FOUC

Your environment 🌎

No response

TrentsPC avatar Feb 11 '24 05:02 TrentsPC

I recently needed this feature too. It would help me to have a cleaner "critical css" implementation.

indeyets avatar Apr 18 '24 13:04 indeyets