fix(vue-app): multiple named views cause invalid syntax (#5262)

packages/vue-app/template/router.js

@@ -3,11 +3,12 @@ import Router from 'vue-router'
 import { interopDefault } from './utils'<%= isTest ? '// eslint-disable-line no-unused-vars' : '' %>
 
 <% function recursiveRoutes(routes, tab, components, indentCount) {
-  let res = '', resMap = ''
+  let res = ''
   const baseIndent = tab.repeat(indentCount)
   const firstIndent = '\n' + tab.repeat(indentCount + 1)
   const nextIndent = ',' + firstIndent
   routes.forEach((route, i) => {
+    let resMap = ''
     // If need to handle named views
     if (route.components) {
       let _name = '_' + hash(route.components.default)

test/fixtures/named-views/nuxt.config.js

@@ -1,30 +1,32 @@
 export default {
   router: {
     extendRoutes(routes, resolve) {
-      const indexIndex = routes.findIndex(route => route.name === 'index')
-      let index = routes[indexIndex].children.findIndex(route => route.name === 'index-child-id')
-      routes[indexIndex].children[index] = {
-        ...routes[indexIndex].children[index],
+      const indexRoute = routes.find(route => route.name === 'index')
+      const indexChildRoute = indexRoute.children.find(route => route.name === 'index-child-id')
+
+      Object.assign(indexChildRoute, {
         components: {
-          default: routes[indexIndex].children[index].component,
+          default: indexChildRoute.component,
           left: resolve(__dirname, 'components/childLeft.vue')
         },
         chunkNames: {
           left: 'components/childLeft'
         }
-      }
+      })
 
-      index = routes.findIndex(route => route.name === 'main')
-      routes[index] = {
-        ...routes[index],
+      routes
+        .filter(route => ['main', 'another'].includes(route.name))
+        .forEach((route) => {
+          Object.assign(route, {
             components: {
-          default: routes[index].component,
+              default: route.component,
               top: resolve(__dirname, 'components/mainTop.vue')
             },
             chunkNames: {
               top: 'components/mainTop'
             }
-      }
+          })
+        })
     }
   }
 }

test/fixtures/named-views/pages/another.vue

@@ -0,0 +1,6 @@
+<template>
+  <p>
+    This page exists to ensure no regression on a bug. See the commit for more
+    details.
+  </p>
+</template>