vue-jsonld
v1.0.1vue-jsonld
Declarative JSON-LD Structured Data for Vue App. SSR supported
Install
yarn add vue-jsonld
Usage
import VueJsonLD from 'vue-jsonld'
Vue.use(VueJsonLD)
json
<template>
...
</template>
<script>
export default {
jsonld: {
"@context": "http://schema.org/",
"@type": "Code",
"name": "vue-jsonld",
"description": "Declarative JSON-LD Structured Data for Vue App",
"discussionUrl": "https://github.com/ariesjia/vue-jsonld"
},
}
</script>
function
<template>
...
</template>
<script>
export default {
data() {
return {
name: 'vue-jsonld'
},
}
jsonld() {
return {
"@context": "http://schema.org/",
"@type": "Code",
"name": this.name,
"description": "Declarative JSON-LD Structured Data for Vue App",
"discussionUrl": "https://github.com/ariesjia/vue-jsonld"
}
},
}
</script>
SSR
server-entry.js
import app from './app'
const router = app.$router
const $jsonld = app.$jsonld()
export default (context) => {
router.push(context.url)
context.jsonld = jsonld
return app
}
index.template.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>demo</title>
{{{ jsonld.html }}}
</head>
<body>
<!--vue-ssr-outlet-->
</body>
</html>
