fix: merge route.meta into options.meta (#4479)

[skip release]

packages/vue-app/template/utils.js

@@ -111,8 +111,8 @@ export async function getRouteData(route) {
   // Send back a copy of route with meta based on Component definition
   return {
     ...route,
-    meta: getMatchedComponents(route).map((Component) => {
+    meta: getMatchedComponents(route).map((Component, index) => {
-      return Component.options.meta || route.meta || {}
+      return { ...Component.options.meta, ...(index ? {} : route.meta) }
     })
   }
 }

test/fixtures/with-config/nuxt.config.js

@@ -17,7 +17,8 @@ export default {
         {
           name: 'about-bis',
           path: '/about-bis',
-          component: '~/pages/about.vue'
+          component: '~/pages/about.vue',
+          meta: { text: 'test-meta' }
         },
         {
           path: '/redirect/about-bis',

test/fixtures/with-config/pages/about.vue

@@ -1,6 +1,7 @@
 <template>
   <div>
     <h1>About page</h1>
+    <h2>{{ meta[0].text }}</h2>
     <NuxtLink to="/">
       Home page
     </NuxtLink>
@@ -9,6 +10,9 @@
 
 <script>
 export default {
-  layout: 'custom'
+  layout: 'custom',
+  asyncData({ route }) {
+    return { meta: route.meta || 'empty-meta' }
+  }
 }
 </script>

test/unit/with-config.test.js

@@ -134,6 +134,7 @@ describe('with-config', () => {
     const html = window.document.body.innerHTML
     expect(html).toContain('<h1>Custom layout</h1>')
     expect(html).toContain('<h1>About page</h1>')
+    expect(html).toContain('<h2>test-meta</h2>')
   })
 
   test('/test/not-existed should return 404', async () => {