From 940d48333f6572314576da9312f36018fd70bdc8 Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Tue, 19 Jan 2021 21:46:48 -0500
Subject: [PATCH] fix: inline async css for legacy builds

---
 packages/vite/src/node/plugins/css.ts | 34 +++++++++++++++++++++------
 1 file changed, 27 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/node/plugins/css.ts b/packages/vite/src/node/plugins/css.ts
index 482d7f2f87ab04..96f287ab620485 100644
--- a/packages/vite/src/node/plugins/css.ts
+++ b/packages/vite/src/node/plugins/css.ts
@@ -23,6 +23,7 @@ import { CLIENT_PUBLIC_PATH } from '../constants'
 import { ProcessOptions, Result, Plugin as PostcssPlugin } from 'postcss'
 import { ViteDevServer } from '../'
 import { assetUrlRE, urlToBuiltUrl } from './asset'
+import MagicString from 'magic-string'
 
 // const debug = createDebugger('vite:css')
 
@@ -221,13 +222,32 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
         if (config.build.minify) {
           chunkCSS = await minifyCSS(chunkCSS, config)
         }
-        // emit corresponding css file
-        const fileHandle = this.emitFile({
-          name: chunk.name + '.css',
-          type: 'asset',
-          source: chunkCSS
-        })
-        chunkToEmittedCssFileMap.set(chunk, fileHandle)
+        if (opts.format === 'es') {
+          // emit corresponding css file
+          const fileHandle = this.emitFile({
+            name: chunk.name + '.css',
+            type: 'asset',
+            source: chunkCSS
+          })
+          chunkToEmittedCssFileMap.set(chunk, fileHandle)
+        } else {
+          // legacy build, inline css
+          const style = `__vite_style__`
+          const injectCode =
+            `var ${style} = document.createElement('style');` +
+            `${style}.innerHTML = ${JSON.stringify(chunkCSS)};` +
+            `document.head.appendChild(${style});`
+          if (config.build.sourcemap) {
+            const s = new MagicString(code)
+            s.prepend(injectCode)
+            return {
+              code: s.toString(),
+              map: s.generateMap({ hires: true })
+            }
+          } else {
+            return { code: injectCode + code }
+          }
+        }
         return {
           code,
           map: null