build.cssCodeSplit: false => CSS missing in dist/manifest.json

[brillout]

Describe the bug

When setting build.cssCodeSplit: false then the CSS is missing in the dist/manifest.json (dist/client/manifest.json if using vite-plugin-ssr).

Reproduction

https://github.com/brillout/vite-plugin-ssr-disabled-css-codesplit/tree/main

System Info

System:
    OS: Linux 5.4 Debian GNU/Linux 10 (buster) 10 (buster)
    CPU: (2) x64 06/7a
    Memory: 2.71 GB / 2.71 GB
    Container: Yes
    Shell: 5.0.3 - /bin/bash
  Binaries:
    Node: 16.5.0 - ~/.config/nvm/versions/node/v16.5.0/bin/node
    Yarn: 1.22.11 - ~/.config/nvm/versions/node/v16.5.0/bin/yarn
    npm: 7.20.5 - ~/.config/nvm/versions/node/v16.5.0/bin/npm
    Watchman: 4.9.0 - /home/romuuu/.nix-profile/bin/watchman
  Browsers:
    Firefox: 83.0
  npmPackages:
    @vitejs/plugin-vue: ^2.0.1 => 2.0.1 
    vite: ^2.7.2 => 2.7.10 

Used Package Manager

yarn

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[Mcdostone]

Same issue with the following vite configuration https://stackblitz.com/edit/vite-dkc1an?file=vite.config.js

// vite.config.js
import { defineConfig } from 'vite'
import path from 'path'

export default defineConfig(() => {
    return {
      root: '.',
      build: {
        outDir: './dist',
        manifest: true,
        cssCodeSplit: false,
        rollupOptions: {
          input: {
            'css/style.css': path.resolve('./style.css'),
          },
        },
      },
    }
})

npm run build

> vite-project@0.0.0 build
> vite build

vite v2.7.10 building for production...
✓ 1 modules transformed.
dist/manifest.json                      0.11 KiB
dist/assets/css/style.css.1b65f072.js   0.00 KiB / gzip: 0.02 KiB  # does it make any sense?
dist/assets/style.0cc4c6eb.css          0.17 KiB / gzip: 0.14 KiB     # output path is wrong, I would expect dist/assets/css/style.0cc4c6eb.css

{
  "style.css": {
    "file": "assets/css/style.css.1b65f072.js", // I would expect a CSS file, not JS 
    "src": "style.css",
    "isEntry": true
  }
}

[davidwebca]

Was this ever solved? I'm currently facing the same issue, I'm unable to get my CSS file to bundle into one file instead of multiple... 🤔

[laurentvd]

No, but I made a workaround. I'm building my frontend using yarn run build. Yarn then automatically triggers the postbuild command:

"postbuild": "yarn run write-style-path-to-manifest",
"write-style-path-to-manifest": "sed -e '$ d' ../public/build/manifest.json > ../public/build/manifest-temp.json && echo ',\"styles.css\": \"'$(cd ../public/build && ls assets/*.css)'\"}' >> ../public/build/manifest-temp.json && mv -f ../public/build/manifest-temp.json ../public/build/manifest.json",

Basically, it replaces the last line of my manifest file with the path to the only css file in assets.

[sapphi-red]

Fixed in #6649