From 7f8db9fb44fa3ac8441292ee48fc9efe1d11ab3c Mon Sep 17 00:00:00 2001
From: Clark Du <clark.duxin@gmail.com>
Date: Tue, 27 Mar 2018 16:01:01 +0800
Subject: [PATCH 1/2] feat(ssr): render initial and used async css chunks

---
 src/server/template-renderer/index.js | 12 ++++++------
 src/server/webpack-plugin/client.js   |  6 +++---
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/server/template-renderer/index.js b/src/server/template-renderer/index.js
index dabc08a149c..7b431156e7a 100644
--- a/src/server/template-renderer/index.js
+++ b/src/server/template-renderer/index.js
@@ -108,9 +108,9 @@ export default class TemplateRenderer {
   }
 
   renderStyles (context: Object): string {
-    const cssFiles = this.clientManifest
-      ? this.clientManifest.all.filter(isCSS)
-      : []
+    const initial = this.preloadFiles || []
+    const async = this.getUsedAsyncFiles(context) || []
+    const cssFiles = initial.concat(async).filter(({ file }) => isCSS(file))
     return (
       // render links for css files
       (cssFiles.length
@@ -202,10 +202,10 @@ export default class TemplateRenderer {
 
   renderScripts (context: Object): string {
     if (this.clientManifest) {
-      const initial = this.preloadFiles
-      const async = this.getUsedAsyncFiles(context)
+      const initial = this.preloadFiles.filter(({ file }) => isJS(file))
+      const async = (this.getUsedAsyncFiles(context) || []).filter(({ file }) => isJS(file))
       const needed = [initial[0]].concat(async || [], initial.slice(1))
-      return needed.filter(({ file }) => isJS(file)).map(({ file }) => {
+      return needed.map(({ file }) => {
         return `<script src="${this.publicPath}/${file}" defer></script>`
       }).join('')
     } else {
diff --git a/src/server/webpack-plugin/client.js b/src/server/webpack-plugin/client.js
index 5f2cd4bd6c6..f3ad0911b96 100644
--- a/src/server/webpack-plugin/client.js
+++ b/src/server/webpack-plugin/client.js
@@ -1,6 +1,6 @@
 const hash = require('hash-sum')
 const uniq = require('lodash.uniq')
-import { isJS } from './util'
+import { isJS, isCSS } from './util'
 
 export default class VueSSRClientPlugin {
   constructor (options = {}) {
@@ -19,10 +19,10 @@ export default class VueSSRClientPlugin {
       const initialFiles = uniq(Object.keys(stats.entrypoints)
         .map(name => stats.entrypoints[name].assets)
         .reduce((assets, all) => all.concat(assets), [])
-        .filter(isJS))
+        .filter((file) => isJS(file) || isCSS(file)))
 
       const asyncFiles = allFiles
-        .filter(isJS)
+        .filter((file) => isJS(file) || isCSS(file))
         .filter(file => initialFiles.indexOf(file) < 0)
 
       const manifest = {

From 7f308c5fd4ed3db5653544097a013df2e58f53ee Mon Sep 17 00:00:00 2001
From: Clark Du <clark.duxin@gmail.com>
Date: Tue, 27 Mar 2018 16:10:18 +0800
Subject: [PATCH 2/2] fix: flow error, file is a property in object

---
 src/server/template-renderer/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/server/template-renderer/index.js b/src/server/template-renderer/index.js
index 7b431156e7a..a6a1570c6b7 100644
--- a/src/server/template-renderer/index.js
+++ b/src/server/template-renderer/index.js
@@ -114,7 +114,7 @@ export default class TemplateRenderer {
     return (
       // render links for css files
       (cssFiles.length
-        ? cssFiles.map(file => `<link rel="stylesheet" href="${this.publicPath}/${file}">`).join('')
+        ? cssFiles.map(({ file }) => `<link rel="stylesheet" href="${this.publicPath}/${file}">`).join('')
         : '') +
       // context.styles is a getter exposed by vue-style-loader which contains
       // the inline component styles collected during SSR