From d03a61b04040f21952af5840abaaf30240eda591 Mon Sep 17 00:00:00 2001
From: Michael Leaney <leahciMic@users.noreply.github.com>
Date: Tue, 19 Mar 2019 18:25:20 +0800
Subject: [PATCH] fix(vue-app): multiple named views cause invalid syntax
 (#5262)

---
 packages/vue-app/template/router.js         |  3 +-
 test/fixtures/named-views/nuxt.config.js    | 36 +++++++++++----------
 test/fixtures/named-views/pages/another.vue |  6 ++++
 3 files changed, 27 insertions(+), 18 deletions(-)
 create mode 100644 test/fixtures/named-views/pages/another.vue

diff --git a/packages/vue-app/template/router.js b/packages/vue-app/template/router.js
index c3b6d860d1..520f563807 100644
--- a/packages/vue-app/template/router.js
+++ b/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)
diff --git a/test/fixtures/named-views/nuxt.config.js b/test/fixtures/named-views/nuxt.config.js
index a23f24aae9..7d45b8c013 100644
--- a/test/fixtures/named-views/nuxt.config.js
+++ b/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],
-        components: {
-          default: routes[index].component,
-          top: resolve(__dirname, 'components/mainTop.vue')
-        },
-        chunkNames: {
-          top: 'components/mainTop'
-        }
-      }
+      routes
+        .filter(route => ['main', 'another'].includes(route.name))
+        .forEach((route) => {
+          Object.assign(route, {
+            components: {
+              default: route.component,
+              top: resolve(__dirname, 'components/mainTop.vue')
+            },
+            chunkNames: {
+              top: 'components/mainTop'
+            }
+          })
+        })
     }
   }
 }
diff --git a/test/fixtures/named-views/pages/another.vue b/test/fixtures/named-views/pages/another.vue
new file mode 100644
index 0000000000..3a03798e51
--- /dev/null
+++ b/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>