mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-30 09:27:13 +00:00
feat: support setting (non-essential) vue-meta options by user (#6432)
This commit is contained in:
parent
ec6ef6e425
commit
b17f331fe5
@ -6,6 +6,8 @@ export default () => ({
|
||||
}
|
||||
},
|
||||
|
||||
vueMeta: null,
|
||||
|
||||
head: {
|
||||
meta: [],
|
||||
link: [],
|
||||
|
@ -367,6 +367,7 @@ Object {
|
||||
"silent": true,
|
||||
},
|
||||
},
|
||||
"vueMeta": null,
|
||||
"watch": Array [
|
||||
"/var/nuxt/test/nuxt.config.js",
|
||||
],
|
||||
|
@ -334,6 +334,7 @@ Object {
|
||||
"silent": undefined,
|
||||
},
|
||||
},
|
||||
"vueMeta": null,
|
||||
"watch": Array [],
|
||||
"watchers": Object {
|
||||
"chokidar": Object {
|
||||
@ -681,6 +682,7 @@ Object {
|
||||
"silent": undefined,
|
||||
},
|
||||
},
|
||||
"vueMeta": null,
|
||||
"watch": Array [],
|
||||
"watchers": Object {
|
||||
"chokidar": Object {
|
||||
|
@ -43,14 +43,17 @@ Vue.component(NuxtChild.name, NuxtChild)
|
||||
// Component: <Nuxt>`
|
||||
Vue.component(Nuxt.name, Nuxt)
|
||||
|
||||
<% if (features.meta) { %>
|
||||
<% if (features.meta) {
|
||||
// vue-meta configuration
|
||||
Vue.use(Meta, {
|
||||
const vueMetaOptions = {
|
||||
...nuxtOptions.vueMeta,
|
||||
keyName: 'head', // the component option name that vue-meta looks for meta info on.
|
||||
attribute: 'data-n-head', // the attribute name vue-meta adds to the tags it observes
|
||||
ssrAttribute: 'data-n-head-ssr', // the attribute name that lets vue-meta know that meta info has already been server-rendered
|
||||
tagIDKeyName: 'hid' // the property name that vue-meta uses to determine whether to overwrite or append a tag
|
||||
})
|
||||
}
|
||||
%>
|
||||
Vue.use(Meta, <%= JSON.stringify(vueMetaOptions) %>)<%= isTest ? '// eslint-disable-line' : '' %>
|
||||
<% } %>
|
||||
|
||||
<% if (features.transitions) { %>
|
||||
|
@ -13,10 +13,11 @@ export default class SPARenderer extends BaseRenderer {
|
||||
this.cache = new LRU()
|
||||
|
||||
this.vueMetaConfig = {
|
||||
ssrAppId: '1',
|
||||
...this.options.vueMeta,
|
||||
keyName: 'head',
|
||||
attribute: 'data-n-head',
|
||||
ssrAttribute: 'data-n-head-ssr',
|
||||
ssrAppId: '1',
|
||||
tagIDKeyName: 'hid'
|
||||
}
|
||||
}
|
||||
|
9
test/fixtures/basic/pages/head.vue
vendored
9
test/fixtures/basic/pages/head.vue
vendored
@ -8,6 +8,15 @@
|
||||
export default {
|
||||
head: {
|
||||
title: 'My title',
|
||||
htmlAttrs: {
|
||||
foo: 'baz'
|
||||
},
|
||||
headAttrs: {
|
||||
bar: 'foo'
|
||||
},
|
||||
bodyAttrs: {
|
||||
baz: 'bar'
|
||||
},
|
||||
meta: [
|
||||
{ content: 'my meta' }
|
||||
],
|
||||
|
3
test/fixtures/meta-attrs/meta-attrs.test.js
vendored
3
test/fixtures/meta-attrs/meta-attrs.test.js
vendored
@ -1,3 +0,0 @@
|
||||
import { buildFixture } from '../../utils/build'
|
||||
|
||||
buildFixture('meta-attrs')
|
15
test/fixtures/meta-attrs/nuxt.config.js
vendored
15
test/fixtures/meta-attrs/nuxt.config.js
vendored
@ -1,15 +0,0 @@
|
||||
export default {
|
||||
head: {
|
||||
htmlAttrs: {
|
||||
foo: 'baz'
|
||||
},
|
||||
|
||||
headAttrs: {
|
||||
bar: 'foo'
|
||||
},
|
||||
|
||||
bodyAttrs: {
|
||||
baz: 'bar'
|
||||
}
|
||||
}
|
||||
}
|
3
test/fixtures/with-config/nuxt.config.js
vendored
3
test/fixtures/with-config/nuxt.config.js
vendored
@ -11,6 +11,9 @@ export default {
|
||||
total: true
|
||||
}
|
||||
},
|
||||
vueMeta: {
|
||||
ssrAppId: 'test-ssr-app-id'
|
||||
},
|
||||
router: {
|
||||
base: '/test/',
|
||||
middleware: 'noop',
|
||||
|
13
test/fixtures/with-config/pages/head.vue
vendored
Normal file
13
test/fixtures/with-config/pages/head.vue
vendored
Normal file
@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>Head page</h1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
head: {
|
||||
noscript: [{ innerHTML: 'noscript' }]
|
||||
}
|
||||
}
|
||||
</script>
|
@ -82,13 +82,17 @@ describe('basic ssr', () => {
|
||||
const window = await nuxt.server.renderAndGetWindow(url('/head'))
|
||||
expect(window.document.title).toBe('My title - Nuxt.js')
|
||||
|
||||
const html = window.document.body.innerHTML
|
||||
const html = window.document.querySelector('html').outerHTML
|
||||
expect(html).toContain('<div><h1>I can haz meta tags</h1></div>')
|
||||
expect(html).toContain('<script data-n-head="ssr" src="/body.js" data-body="true">')
|
||||
|
||||
const metas = window.document.getElementsByTagName('meta')
|
||||
expect(metas[0].getAttribute('content')).toBe('my meta')
|
||||
expect(consola.log).toHaveBeenCalledWith('Body script!')
|
||||
|
||||
expect(html).toContain('<html foo="baz" data-n-head="foo">')
|
||||
expect(html).toContain('<head bar="foo" data-n-head="bar">')
|
||||
expect(html).toContain('<body baz="bar" data-n-head="baz">')
|
||||
})
|
||||
|
||||
test('/async-data', async () => {
|
||||
|
@ -1,25 +0,0 @@
|
||||
import { loadFixture, getPort, Nuxt } from '../utils'
|
||||
|
||||
let nuxt = null
|
||||
|
||||
describe('meta-attrs', () => {
|
||||
beforeAll(async () => {
|
||||
const options = await loadFixture('meta-attrs')
|
||||
nuxt = new Nuxt(options)
|
||||
await nuxt.ready()
|
||||
|
||||
await nuxt.server.listen(await getPort(), '0.0.0.0')
|
||||
})
|
||||
|
||||
test('/', async () => {
|
||||
const { html } = await nuxt.server.renderRoute('/')
|
||||
expect(html).toContain('<html data-n-head-ssr foo="baz" data-n-head="foo">')
|
||||
expect(html).toContain('<head bar="foo" data-n-head="bar">')
|
||||
expect(html).toContain('<body baz="bar" data-n-head="baz">')
|
||||
})
|
||||
|
||||
// Close server and ask nuxt to stop listening to file changes
|
||||
afterAll(async () => {
|
||||
await nuxt.close()
|
||||
})
|
||||
})
|
@ -182,6 +182,12 @@ describe('with-config', () => {
|
||||
.rejects.toMatchObject({ statusCode: 404 })
|
||||
})
|
||||
|
||||
test('/test/head', async () => {
|
||||
const window = await nuxt.server.renderAndGetWindow(url('/test/head'))
|
||||
const html = window.document.querySelector('head').innerHTML
|
||||
expect(html).toContain('<noscript data-n-head="test-ssr-app-id">noscript</noscript>')
|
||||
})
|
||||
|
||||
test('should ignore files in .nuxtignore', async () => {
|
||||
await expect(rp(url('/test-ignore')))
|
||||
.rejects.toMatchObject({ statusCode: 404 })
|
||||
|
Loading…
Reference in New Issue
Block a user