diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js
index 6791822..d49ecc6 100644
--- a/docs/.vuepress/config.js
+++ b/docs/.vuepress/config.js
@@ -27,14 +27,21 @@ module.exports = {
link: 'https://github.com/nuxt/vue-meta/releases'
}],
sidebar: [
- '/installation.md',
'/',
+ {
+ title: 'Getting started',
+ collapsable: false,
+ children: [
+ '/guide/',
+ '/guide/preparing',
+ '/guide/ssr',
+ '/guide/frameworks'
+ ]
+ },
{
title: 'Usage',
collapsable: false,
children: [
- '/guide/',
- '/guide/ssr',
'/guide/metainfo',
'/guide/special',
'/guide/caveats',
@@ -50,19 +57,7 @@ module.exports = {
'/faq/component-props.md',
'/faq/async-action.md',
]
- },
- /*{
- title: 'Advanced',
- collapsable: false,
- children: [
- '/guide/advanced/navigation-guards.md',
- '/guide/advanced/meta.md',
- '/guide/advanced/transitions.md',
- '/guide/advanced/data-fetching.md',
- '/guide/advanced/scroll-behavior.md',
- '/guide/advanced/lazy-loading.md'
- ]
- }*/
+ }
]
},
}
diff --git a/docs/guide/README.md b/docs/guide/README.md
index 784b69f..ac5e070 100644
--- a/docs/guide/README.md
+++ b/docs/guide/README.md
@@ -1,36 +1,48 @@
-# Preparing the plugin
-:::tip Note
-This step is optional if you don't need SSR and `Vue` is available as a global variable. `vue-meta` will install itself in this case.
+# Installation
+
+:::tip Using a framework?
+
+Are you using a framework like Nuxt.js, Gridsome or another one which uses vue-meta? Then `vue-meta` should already be installed and you can skip to [Usage](/guide/metainfo.html) or consult the [documentation](/guide/frameworks.html) of your framework for more details.
:::
-In order to use this plugin, you first need to pass it to `Vue.use` - if you're not rendering on the server-side, your entry file will suffice. If you are rendering on the server, then place it in a file that runs both on the server and on the client before your root instance is mounted. If you're using [`vue-router`](https://github.com/vuejs/vue-router), then your main `router.js` file is a good place:
+## Download / CDN
+
+[https://unpkg.com/vue-meta/lib/vue-meta.js](https://unpkg.com/vue-meta/lib/vue-meta.js)
+
+For the latest version in the v1.x branch you can use:
+[https://unpkg.com/vue-meta@1/lib/vue-meta.js](https://unpkg.com/vue-meta@1/lib/vue-meta.js)
+
+Or you can replace `1` with the full version number you wish to use.
+
+If you include vue-meta after Vue it will install automatically
+
+**Uncompressed:**
+```html
+
+```
+
+**Minified:**
+```html
+
+```
+
+## Package manager
+**Yarn**
+```sh
+$ yarn add vue-meta
+```
+
+**npm**
+```sh
+$ npm install vue-meta --save
+```
+
+### Install
+You need to explicitly install vue-meta when using a package manager
-**router.js:**
```js
import Vue from 'vue'
-import Router from 'vue-router'
-import Meta from 'vue-meta'
+import VueMeta from 'vue-meta'
-Vue.use(Router)
-Vue.use(Meta)
-
-export default new Router({
- ...
-})
+Vue.use(VueMeta)
```
-
-## Options
-
-`vue-meta` allows a few custom options:
-
-```js
-Vue.use(Meta, {
- keyName: 'metaInfo',
- attribute: 'data-vue-meta',
- ssrAttribute: 'data-vue-meta-server-rendered',
- tagIDKeyName: 'vmid',
- refreshOnceOnNavigation: true
-})
-```
-
-See the [API](/api/#plugin-options) for a description of the available plugin options
diff --git a/docs/guide/caveats.md b/docs/guide/caveats.md
index 4e18fde..3b6d797 100644
--- a/docs/guide/caveats.md
+++ b/docs/guide/caveats.md
@@ -3,7 +3,7 @@
## Reactive variables in template functions
Both [title](/api/#titletemplate) as [meta](/api/#content-templates) support using template function.
-Due to how Vue determines reactivity it is not possible to use reactive variables directly in template function
+Due to how Vue determines reactivity it is not possible to use reactive variables directly in template functions
```js
{
@@ -20,7 +20,7 @@ Due to how Vue determines reactivity it is not possible to use reactive variable
}
```
-You need to assign the reactive variable to a local variable for this to work:
+You need to assign the reactive variable to a local variable first for this to work:
```js
{
diff --git a/docs/guide/frameworks.md b/docs/guide/frameworks.md
new file mode 100644
index 0000000..bee36d7
--- /dev/null
+++ b/docs/guide/frameworks.md
@@ -0,0 +1,11 @@
+# Frameworks
+
+If you are using a framework which uses `vue-meta`, please make sure to consult their documentation first
+
+## Gridsome
+
+Proceed to the [Gridsome documentation](https://gridsome.org/docs)
+
+## Nuxt.js
+
+Proceed to the [Nuxt.js documentation](https://nuxtjs.org/api)
diff --git a/docs/guide/preparing.md b/docs/guide/preparing.md
new file mode 100644
index 0000000..784b69f
--- /dev/null
+++ b/docs/guide/preparing.md
@@ -0,0 +1,36 @@
+# Preparing the plugin
+:::tip Note
+This step is optional if you don't need SSR and `Vue` is available as a global variable. `vue-meta` will install itself in this case.
+:::
+
+In order to use this plugin, you first need to pass it to `Vue.use` - if you're not rendering on the server-side, your entry file will suffice. If you are rendering on the server, then place it in a file that runs both on the server and on the client before your root instance is mounted. If you're using [`vue-router`](https://github.com/vuejs/vue-router), then your main `router.js` file is a good place:
+
+**router.js:**
+```js
+import Vue from 'vue'
+import Router from 'vue-router'
+import Meta from 'vue-meta'
+
+Vue.use(Router)
+Vue.use(Meta)
+
+export default new Router({
+ ...
+})
+```
+
+## Options
+
+`vue-meta` allows a few custom options:
+
+```js
+Vue.use(Meta, {
+ keyName: 'metaInfo',
+ attribute: 'data-vue-meta',
+ ssrAttribute: 'data-vue-meta-server-rendered',
+ tagIDKeyName: 'vmid',
+ refreshOnceOnNavigation: true
+})
+```
+
+See the [API](/api/#plugin-options) for a description of the available plugin options
diff --git a/docs/installation.md b/docs/installation.md
deleted file mode 100644
index ea36d4f..0000000
--- a/docs/installation.md
+++ /dev/null
@@ -1,43 +0,0 @@
-# Installation
-
-## Download / CDN
-
-[https://unpkg.com/vue-meta/lib/vue-meta.js](https://unpkg.com/vue-meta/lib/vue-meta.js)
-
-For the latest version in the v1.x branch you can use:
-[https://unpkg.com/vue-meta@1/lib/vue-meta.js](https://unpkg.com/vue-meta@1/lib/vue-meta.js)
-
-Or you can replace `1` with the full version number you wish to use.
-
-If you include vue-meta after Vue it will install automatically
-
-**Uncompressed:**
-```html
-
-```
-
-**Minified:**
-```html
-
-```
-
-## Package manager
-**Yarn**
-```sh
-$ yarn add vue-meta
-```
-
-**npm**
-```sh
-$ npm install vue-meta --save
-```
-
-### Install
-You need to explicitly install vue-meta when using a package manager
-
-```js
-import Vue from 'vue'
-import VueMeta from 'vue-meta'
-
-Vue.use(VueMeta)
-```