Kdu Meta
Manage HTML metadata in Kdu.js components with SSR support
<template>
...
</template>
<script>
export default {
metaInfo: {
title: 'My Example App',
titleTemplate: '%s - Yay!',
htmlAttrs: {
lang: 'en',
amp: true
}
}
}
</script><html lang="en" amp>
<head>
<title>My Example App - Yay!</title>
...
</head>Introduction
Kdu Meta is a Kdu.js plugin that allows you to manage your app's metadata. It is inspired by and works similar as react-helmet for react. However, instead of setting your data as props passed to a proprietary component, you simply export it as part of your component's data using the metaInfo property.
These properties, when set on a deeply nested component, will cleverly overwrite their parent components' metaInfo, thereby enabling custom info for each top-level view as well as coupling metadata directly to deeply nested subcomponents for more maintainable code.
Installation
Yarn
$ yarn add kdu-metanpm
$ npm install kdu-meta --saveDownload / CDN
Use the download links below - if you want a previous version, check the instructions at https://unpkg.com.
Latest version: https://unpkg.com/kdu-meta/dist/kdu-meta.min.js
Uncompressed:
<script src="https://unpkg.com/kdu-meta/dist/kdu-meta.js"></script>Minified:
<script src="https://unpkg.com/kdu-meta/dist/kdu-meta.min.js"></script>Quick Usage
import Kdu from 'kdu'
import KduMeta from 'kdu-meta'
Kdu.use(KduMeta, {
// optional pluginOptions
refreshOnceOnNavigation: true
})