fix: make ssr-build-plugin compatible with webpack4/5 (fix #11718)

src/server/template-renderer/index.js

@@ -55,7 +55,7 @@ export default class TemplateRenderer {
     this.inject = options.inject !== false
     // if no template option is provided, the renderer is created
     // as a utility object for rendering assets like preload links and scripts.
-    
+
     const { template } = options
     this.parsedTemplate = template
       ? typeof template === 'string'
@@ -224,7 +224,7 @@ export default class TemplateRenderer {
     if (this.clientManifest) {
       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))
+      const needed = [].concat(initial[0] ? [initial[0]] : [], async, initial.slice(1));
       return needed.map(({ file }) => {
         return `<script src="${this.publicPath}${file}" defer></script>`
       }).join('')

src/server/webpack-plugin/client.js

@@ -19,6 +19,20 @@ export default class VueSSRClientPlugin {
       const initialFiles = uniq(Object.keys(stats.entrypoints)
         .map(name => stats.entrypoints[name].assets)
         .reduce((assets, all) => all.concat(assets), [])
+        .map(function (file) {
+          if (typeof file === "string") {
+            return file;
+          }
+
+          if (
+            Object.prototype.toString.call(file) === "[object Object]" &&
+            file.name
+          ) {
+            return file.name;
+          }
+
+          throw new Error(`file structure is not correct: ${file}`);
+        })
         .filter((file) => isJS(file) || isCSS(file)))
 
       const asyncFiles = allFiles

src/server/webpack-plugin/server.js

@@ -20,7 +20,21 @@ export default class VueSSRServerPlugin {
         return cb()
       }
 
-      const entryAssets = entryInfo.assets.filter(isJS)
+      const entryAssets = entryInfo.assets
+        .map(function (file) {
+          if (typeof file === "string") {
+            return file;
+          }
+
+          if (
+            Object.prototype.toString.call(file) === "[object Object]" &&
+            file.name
+          ) {
+            return file.name;
+          }
+
+          throw new Error(`file structure is not correct: ${file}`);
+        }).filter(isJS)
 
       if (entryAssets.length > 1) {
         throw new Error(
@@ -45,6 +59,9 @@ export default class VueSSRServerPlugin {
       stats.assets.forEach(asset => {
         if (isJS(asset.name)) {
           bundle.files[asset.name] = compilation.assets[asset.name].source()
+          if (asset.info && asset.info.related && asset.info.related.sourceMap) {
+            bundle.maps[asset.info.related.sourceMap.replace(/\.map$/, '')] = JSON.parse(compilation.assets[asset.info.related.sourceMap].source());
+          }
         } else if (asset.name.match(/\.js\.map$/)) {
           bundle.maps[asset.name.replace(/\.map$/, '')] = JSON.parse(compilation.assets[asset.name].source())
         }