solidjs / solid

A declarative, efficient, and flexible JavaScript library for building user interfaces.
https://solidjs.com
MIT License
32.17k stars 918 forks source link

HTML Minification Issue in Production Builds (Unexpected Single Line Output) #2184

Closed tearf001 closed 3 months ago

tearf001 commented 3 months ago

Describe the bug

Hello SolidStart team,

I'm facing an issue where the index.html file generated by SolidStart in production builds is entirely minified into a single line. This makes it difficult to watch and debug the HTML. JavaScript resources within the project, however, are not being minified by vite config minify :false.

Your Example Website or App

just the bare example created by pnpm create solid

Steps to Reproduce the Bug or Issue

  1. pnpm create sold
  2. cd project
  3. pnpm i
  4. pnpm run build

Expected behavior

Vite don't minfiy the entry file by default while solidstart generate that file in StartServer with document prop callback. I'm primarily working with SPA (Single Page Application) architecture and am relatively new to the intricacies of SolidStart's build process. Could you please provide some guidance on how to prevent this single-line minification of the index.html file?

Thank you for your time and assistance!

Screenshots or Videos

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  ssr: false,
  vite: {
    plugins: [ ],
    build: {
      minify: false, //"terser", // 'esbuild'
      // when minify is 'terser', use `terser` as rollup plugin instead of `esbuild`
      terserOptions: {
        compress: {
          drop_console: true, // others Terser options
        },
        // effects WHEN 'terser'
        format: {          
          inline_script: false,
          beautify: true,
          indent_level: 4,
        },
      },
    },
  },
});

Platform

Additional context

SolidStart version: 1.0 Operating System: Windows 10 Node.js version: 20.14.0

ryansolid commented 3 months ago

I see.. Hmm.. we don't try to minify specifically. It's just the output of our JSX compiler. And index.html is just rendered from that JSX. So the same HTML generated during SSR (that matches during hydration with client rendering) is what is occurring here which as you can imagine is very streamlined. I'm not sure the way this is setup we could special case it.

tearf001 commented 3 months ago

Thanks