pimlie
18 KiB
Changelog
All notable changes to this project will be documented in this file. See standard-version for commit guidelines.
3.0.0-alpha.0 (2021-01-25)
The first alpha release for vue-meta v3 supporting Vue 3, basic functionality should work but needs lots more testing. Don't use this in production. Help with squashing bugs would be appreciated.
Quick overview of features
useApi
See ./examples/vue-router for a working example
import { watch } from 'vue'
import { useMeta, useMetainfo } from 'vue-meta'
export default {
setup () {
// add meta info. The object passed into useMeta is configurable
const { meta } = useMeta({
title: 'My Title'
})
// get the currently used metainfo
const metadata = useMetainfo()
watch(metadata, (newValue) => {
// metadata was updated, do something
})
}
}
SSR
See ./examples/ssr for a working example
import { createSSRApp } from 'vue'
import { renderToStringWithMeta } from 'vue-meta'
import { App, metaManager } from './App'
export function renderPage() {
const app = createSSRApp(App)
app.use(metaManager)
const [appHtml, ctx] = await renderToStringWithMeta(app)
return `
<html ${ctx.teleports.htmlAttrs || ''}>
<head ${ctx.teleports.headAttrs || ''}>
${ctx.teleports.head || ''}
</head>
<body ${ctx.teleports.bodyAttrs || ''}>
<div id="app">${appHtml}</div>
${ctx.teleports.body || ''}
</body>
</html>`
Meta Resolvers
needs more attention + real world testing
In vue-meta v2 there was limited control on which metadata to show if you had multiple components returning the same information.
In v3 we introduce meta resolvers, these are functions that should give you full control on which data to show when multiple options exist.
See eg ./src/resolvers/deepest and ./examples/vue-router/main. The deepest resolver uses the data of the component with the highest depth (from the $root component). The resolver in the vue-router example just returns the data of the newest component (highest _uid).
Metainfo Component
Adding this component is currently required, but it will eventually be optional
Add a Metainfo component in your app to extend the used metadata using slots.
<div class="my-layout">
<metainfo>
<!-- // content contains the value active value for base from `useMetainfo` -->
<template v-slot:base="{ content, metainfo }">http://nuxt.dev:3000{{ content }}</template>
<template v-slot:title="{ content, metainfo }">
{{ content }} - {{ metainfo.description }} - Add the description to the title
</template>
</metainfo>
</div>
Known Issues
- Metainfo component has to be present otherwise client side updates wont work
- The error
Uncaught ReferenceError: body is not definedis logged in the browser Solution: Add a body slot to your metainfo component with an empty tag:<metainfo><template v-slot:body><span/></template></metainfo>
Features
- add amp-boilerplate as boolean attribute (resolves: #530) (#531) (bb45319)
- add deepest resolver (wip) (bb04dc0)
- add poc vue-compiler (6d25ff2)
- add support for attributes (wip) (5eaa0ab)
- continued progress (642a62c)
- convert to ts (wip) (28d3fc1)
- first work on vue v3 composition metainfo app (5d0eb1a)
- implement first useApi basics (b0edfbe)
- improve useApi (303eae1)
- make attributes part of the metainfo object (5add8bf)
- make ssr work (9cfde5b)
- refactor of object merge & make vue-router example work (e68b535)
Bug Fixes
- resolving arrays (collections still wip) (5c4ee7a)
2.3.3 (2020-02-26)
Bug Fixes
- memory leak, use hook events (thanks #522) (21621e1)
- support once (with skip) client side (fix #498) (c74c645)
2.3.2 (2020-01-12)
Bug Fixes
2.3.1 (2019-10-09)
Bug Fixes
- accept and pass options as second arg for generate (2ce5177)
- still traverse children when metainfo doesnt return object (#469) (35b7099)
- try to detect global mixins adding meta info (#467) (2231ec1)
2.3.0 (2019-10-03)
2.3.0-beta.0 (2019-09-17)
Bug Fixes
- use computed prop (which uses caching) instead of calling the fn directly (c344d60)
Features
- add option waitOnDestroyed (f745059)
- add options debounceWait (d43b77c)
- add possibility to add additional meta info (0ab76ee)
- add support for setting attributes from multiple apps (d9b0ab2)
- enable setting refreshOnceOnNavigation during runtime (9d14387)
2.2.2 (2019-08-30)
Bug Fixes
- workaround for memoryleak in destroyed hook (ec7b1fb)
- types: add "content" property to MetaPropertyEquiv and remove "name" (#436) (4384f44)
2.2.1 (2019-08-04)
Bug Fixes
2.2.0 (2019-07-28)
Features
- support generating tags directly from metaInfo object (cb2758e)
Tests
2.1.1 (2019-07-26)
Bug Fixes
- babel config for rollup (71b2d52)
2.1.0 (2019-07-24)
Bug Fixes
- also use ssrAppId for client update (50c0509)
- don't generate