mirror of
https://github.com/tenrok/vue-meta.git
synced 2026-06-05 05:12:25 +03:00
docs: add homepage
docs: upgrade to vuepress v1 change pkg description to HTML metadata
This commit is contained in:
@@ -5,7 +5,7 @@
|
||||
</p>
|
||||
|
||||
<h5 align="center">
|
||||
Manage page metadata in Vue.js components with SSR support
|
||||
Manage HTML metadata in Vue.js components with SSR support
|
||||
</h5>
|
||||
|
||||
<p align="center">
|
||||
|
||||
+13
-12
@@ -1,4 +1,12 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
'@vuepress/google-analytics': {
|
||||
ga: 'UA-88662854-1',
|
||||
},
|
||||
'@vuepress/plugin-pwa': {
|
||||
serviceWorker: true
|
||||
}
|
||||
},
|
||||
locales: {
|
||||
'/': {
|
||||
lang: 'en-US',
|
||||
@@ -6,8 +14,6 @@ module.exports = {
|
||||
description: 'Metadata manager for Vue.js'
|
||||
},
|
||||
},
|
||||
ga: 'UA-88662854-1',
|
||||
serviceWorker: true,
|
||||
themeConfig: {
|
||||
repo: 'nuxt/vue-meta',
|
||||
docsDir: 'docs',
|
||||
@@ -16,16 +22,11 @@ module.exports = {
|
||||
label: 'English',
|
||||
selectText: 'Languages',
|
||||
editLinkText: 'Edit this page on GitHub',
|
||||
nav: [{
|
||||
text: 'Guide',
|
||||
link: '/guide/'
|
||||
}, {
|
||||
text: 'API',
|
||||
link: '/api/'
|
||||
}, {
|
||||
text: 'Release Notes',
|
||||
link: 'https://github.com/nuxt/vue-meta/releases'
|
||||
}],
|
||||
nav: [
|
||||
{ text: 'Guide', link: '/guide/' },
|
||||
{ text: 'API', link: '/api/' },
|
||||
{ text: 'Release Notes', link: 'https://github.com/nuxt/vue-meta/releases' }
|
||||
],
|
||||
sidebar: [
|
||||
'/',
|
||||
{
|
||||
|
||||
+35
-8
@@ -1,14 +1,41 @@
|
||||
<img src="vue-meta.png" alt="vue-meta"/>
|
||||
|
||||
::: tip We need your help
|
||||
---
|
||||
home: true
|
||||
heroImage: /vue-meta.png
|
||||
heroText: vue-meta
|
||||
tagline: HTML Metadata manager for Vue.js
|
||||
actionText: Get Started →
|
||||
actionLink: /guide/
|
||||
features:
|
||||
- title: What
|
||||
details: vue-meta is a plugin for Vue.js which helps you to manage your app's metadata using Vue's built-in reactivity
|
||||
- title: How
|
||||
details: Just export the special property `metaInfo` in any or all your components
|
||||
- title: So?
|
||||
details: Nested components can overwrite each others values, allowing you to easily add or remove metadata where and when you need it
|
||||
footer:
|
||||
MIT License | Created by Declan de Wet, currently developed with ❤ by Nuxt.js core-team & contributors
|
||||
---
|
||||
::: tip We need your help!
|
||||
We are working on defining the RFC for Vue Meta v3.0. It will be a ground-breaking release built from the ground up.
|
||||
|
||||
We would like your help with this! Please visit the [Vue Meta v3.0 rfc](https://github.com/nuxt/rfcs/issues/19) and let us know your thoughts.
|
||||
:::
|
||||
|
||||
# Introduction
|
||||
`vue-meta` is a [Vue.js](https://vuejs.org) plugin that allows you to manage your app's metadata, much like [`react-helmet`](https://github.com/nfl/react-helmet) does 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.
|
||||
```js
|
||||
// Component.vue
|
||||
{
|
||||
metaInfo: {
|
||||
meta: [
|
||||
{ charset: 'utf-8' },
|
||||
{ name: 'viewport', content: 'width=device-width, initial-scale=1' }
|
||||
]
|
||||
}
|
||||
}
|
||||
```
|
||||
```html
|
||||
<!-- Rendered HTML tags in your page -->
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
```
|
||||
|
||||
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 sub components for more maintainable code.
|
||||
|
||||
[Get started](/guide) or play with the [examples](https://github.com/nuxt/vue-meta/tree/master/examples)
|
||||
See the [examples](https://github.com/nuxt/vue-meta/tree/master/examples) for more inspiration!
|
||||
|
||||
+8
-3
@@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "vue-meta",
|
||||
"version": "2.0.0-rc.2",
|
||||
"description": "Manage page metadata in Vue.js components with ssr support",
|
||||
"description": "Manage HTML metadata in Vue.js components with ssr support",
|
||||
"keywords": [
|
||||
"attribute",
|
||||
"google",
|
||||
@@ -30,6 +30,9 @@
|
||||
},
|
||||
{
|
||||
"name": "Sebastien Chopin (@Atinux)"
|
||||
},
|
||||
{
|
||||
"name": "Pim (@pimlie)"
|
||||
}
|
||||
],
|
||||
"files": [
|
||||
@@ -74,6 +77,8 @@
|
||||
"@nuxtjs/eslint-config": "^0.0.1",
|
||||
"@vue/server-test-utils": "^1.0.0-beta.29",
|
||||
"@vue/test-utils": "^1.0.0-beta.29",
|
||||
"@vuepress/plugin-google-analytics": "^1.0.0",
|
||||
"@vuepress/plugin-pwa": "^1.0.0",
|
||||
"babel-core": "^7.0.0-bridge",
|
||||
"babel-eslint": "^10.0.1",
|
||||
"babel-jest": "^24.8.0",
|
||||
@@ -102,7 +107,7 @@
|
||||
"node-env-file": "^0.1.8",
|
||||
"puppeteer-core": "^1.17.0",
|
||||
"rimraf": "^2.6.3",
|
||||
"rollup": "^1.14.2",
|
||||
"rollup": "^1.14.4",
|
||||
"rollup-plugin-buble": "^0.19.6",
|
||||
"rollup-plugin-commonjs": "^10.0.0",
|
||||
"rollup-plugin-json": "^4.0.0",
|
||||
@@ -119,7 +124,7 @@
|
||||
"vue-router": "^3.0.6",
|
||||
"vue-server-renderer": "^2.6.10",
|
||||
"vue-template-compiler": "^2.6.10",
|
||||
"vuepress": "^0.14.11",
|
||||
"vuepress": "^1.0.0",
|
||||
"vuepress-theme-vue": "^1.1.0",
|
||||
"webpack": "^4.33.0"
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user