cssCodeSplit set to false results in no CSS during build

[richardtallent]

Describe the bug

Setting cssCodeSplit:false in vite.config.js results in no CSS being emitted in the dist folder (as .css, or within the .js file). This happens for both JavaScript-imported CSS files as well as SFC style tags.

Since index.css is imported in main.js, I would have expected the contents of the file (as well as any template style tags) to be compiled into the built index.js.

Somewhat-related issue: #621

Reproduction

https://github.com/richardtallent/vite-issue-csscodesplit

This is just the default vite app with the addition of the vite.config.js file with the cssCodeSplit: false setting. The dist folder is included. None of the CSS in index.css makes it into the index.6fd83376.js file, nor are any CSS URLs loaded by that code or linked in index.html.

System Info

• required vite version: vite v1.0.0-rc.9
• required Operating System: Windows 10
• required Node version: 12.19.0
• Optional:
  • npm: 6.14.7
  • Installed vue version: @vue/cli 4.5.8

[richardtallent]

Just a quick note, I confirmed that this issue is still present in rc.13.

[underfin]

This is already fixed at 2.0. Please see migration guide https://vitejs.dev/guide/migration.html.

[richardtallent]

This is only partially in 2.0. It builds the hashed CSS file in the dist/assets folder, but the built index.html file has no <link> reference to the CSS file.

I confirmed this with a brand new npm init @vitejs/app using the vue + ts template. This used beta 12, so I updated to beta 15 and it has the same issue. Here's the vite.config.ts:

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
export default defineConfig({
	plugins: [ vue(), ],
	build: { cssCodeSplit: false, },
});