feat: docs for v2 stable (#338)

.gitignore

@@ -13,3 +13,5 @@ sw.*
 
 # Local Netlify folder
 .netlify
+
+.content

.nuxtrc

@@ -1,2 +1,2 @@
 typescript.includeWorkspace=true
-imports.autoImport=false
+imports.autoImport=true

LICENSE.md

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 Harlan Wilton <https://github.com/harlan-zw>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

content/nuxt-seo/1.getting-started/0.what-is-nuxt-seo.md

@@ -0,0 +1,19 @@
+---
+title: 'What Is Nuxt SEO?'
+description: 'Learn what Nuxt SEO is and how it can help you with your Nuxt site.'
+navigation:
+  title: 'What Is Nuxt SEO'
+---
+
+Nuxt SEO is both a collection of modules and a module itself. The Nuxt SEO module is all the SEO modules combined into one that is guaranteed to work well together.
+
+- [Nuxt Robots](/robots)
+- [Nuxt Sitemap](/sitemap)
+- [Nuxt OG Image](/og-image)
+- [Nuxt Schema.org](/schema-org)
+- [Nuxt SEO Utils](/experiments)
+- [Nuxt Link Checker](/link-checker)
+
+There is no right or wrong way to use Nuxt SEO. It's designed to be flexible and work however you need it to.
+
+To minimise config and ensure the modules work well together, [Nuxt Site Config](/site-config) is installed automatically when using any of the modules.

docs/content/0.nuxt-seo/1.getting-started/1.installation.md → content/nuxt-seo/1.getting-started/1.installation.md

@@ -7,24 +7,20 @@ navigation:
 
 ## Setup
 
-1. Install `@nuxtjs/seo` dependency to your project:
+1. Install SEO dependencies to your project:
 
 ```bash
 npx nuxi@latest module add seo
 ```
 
 ## Site URL
 
-:UBadge{color="amber" variant="solid" label="Important"}
-
 Many of the Nuxt SEO modules will need to know what your production canonical URL is to avoid issues.
 
 You can learn to set one by reading the [Recommended Site Config](/nuxt-seo/guides/configuring-modules) guide.
 
 ## Staging / Testing Environments
 
-:UBadge{color="amber" variant="solid" label="Important"}
-
 If you're using Preview / Staging / Testing environments you will need to add some additional configuration.
 
 Learn how by reading the [Disabling Indexing](/robots/guides/disable-indexing) guide.

docs/content/0.nuxt-seo/1.getting-started/2.faq.md → content/nuxt-seo/1.getting-started/2.faq.md

@@ -18,7 +18,7 @@ production build by a few megabytes, but won't affect the performance of your si
 If the production build size is a concern, you can disable the modules you don't need. The OG Image module
 contributes the most significant amount, you can disable it with `ogImage: { enabled: false }`.
 
-## What happened To Nuxt Seo Kit?
+## What happened To Nuxt SEO Kit?
 
 The Nuxt SEO Kit module was the initial version of Nuxt SEO.
 

docs/content/0.nuxt-seo/1.getting-started/3.stackblitz.md → content/nuxt-seo/1.getting-started/3.stackblitz.md

@@ -1,12 +1,13 @@
 ---
-title: "Reproductions: Stackblitz"
+title: "Reproductions: StackBlitz"
 description: Create minimal reproductions for Nuxt SEO or just experiment with the module.
 ---
 
-You can use the Nuxt SEO Stackblitz playgrounds for either:
+You can use the Nuxt SEO StackBlitz playgrounds for either:
+
 - Playing around with the module in a sandbox environment
 - Making reproductions for issues (Learn more about [Why Reproductions are Required](https://antfu.me/posts/why-reproductions-are-required))
 
-## Stackblitz Playgrounds
+## StackBlitz Playgrounds
 
 - [Basic](https://stackblitz.com/edit/nuxt-starter-gfrej6?file=nuxt.config.ts)

docs/content/0.nuxt-seo/2.guides/0.using-the-modules.md → content/nuxt-seo/2.guides/0.using-the-modules.md

@@ -66,6 +66,7 @@ A few extra SEO Nuxt features that don't fit anywhere else.
 Since Nuxt SEO installs and enables modules for you, you may run into a situation where you want to disable a module.
 
 The modules have these config keys:
+
 - `nuxt-og-image` - `ogImage`
 - `@nuxtjs/sitemap` - `sitemap`
 - `@nuxtjs/robots` - `robots`
@@ -75,7 +76,7 @@ The modules have these config keys:
 
 You can disable any of these modules by setting the module's `enabled` value to `false` in your `nuxt.config.ts` file.
 
-```ts [nuxt.config.ts]
+```ts twoslash [nuxt.config.ts]
 export default defineNuxtConfig({
   ogImage: {
     enabled: false

docs/content/0.nuxt-seo/2.guides/1.configuring-modules.md → content/nuxt-seo/2.guides/1.configuring-modules.md

@@ -7,12 +7,13 @@ description: Configure all Nuxt SEO modules in one place using Nuxt Site Config.
 all modules at runtime, for example in a multi-tenant or i18n app.
 
 It's recommended to set the following config:
+
 - `url` - The canonical URL of your site, avoids duplicate content and consolidates page rank.
 - `name` - The name of your site, used in the title and meta tags.
 - `description` - The description of your site, used in the meta tags.
 - `defaultLocale` - The default locale of your site, used in the meta tags. (you can omit this if you're using `@nuxtjs/i18n`)
 
-```ts [nuxt.config.ts]
+```ts twoslash [nuxt.config.ts]
 export default defineNuxtConfig({
   site: {
     url: 'https://example.com',

docs/content/0.nuxt-seo/2.guides/2.title-templates.md → content/nuxt-seo/2.seo-guides/2.title-templates.md

@@ -5,7 +5,7 @@ description: How to make the most of the title templating engine from Unhead.
 
 The default title template for your site is equivalent to:
 
-```ts
+```ts twoslash
 useHead({
   titleTemplate: '%s %separator %siteName'
 })
@@ -16,13 +16,15 @@ useHead({
 These tokens that are prefixed with `%` are making use of [Template Params](https://unhead.unjs.io/usage/guides/template-params).
 
 The following tokens are available out-of-the-box:
+
 - `%siteName` - The name of your site.
 - `%siteUrl` - The canonical URL of your site.
 - `%s` or `%pageTitle` - The page title, without the template
 - `%separator` - Special token used to separate parts of your title. These have special behaviour in that
 they will be logically removed when it makes sense. See [Separator](https://unhead.unjs.io/usage/guides/template-params#separator) for more details.
 
 These tokens are available not only for the title, but also:
+
 - `meta: [ { content: '%site.url/my-url.png' } ]`
 - `script: [ { type: 'application/json', content: { title: '%s' } } ]`
 
@@ -34,7 +36,7 @@ For example, if you'd like to change the separator (the default is `|`), you can
 
 ::code-group
 
-```ts [nuxt.config.ts]
+```ts twoslash [nuxt.config.ts]
 export default defineNuxtConfig({
   app: {
     head: {
@@ -47,13 +49,15 @@ export default defineNuxtConfig({
 })
 ```
 
-```vue [app.vue]
+```vue twoslash [app.vue]
+<script setup lang="ts">
 useHead({
   templateParams: {
     separator: '-'
     // other common separators: '·', '—', '•'
   }
 })
+</script>
 ```
 
 ::
@@ -62,7 +66,7 @@ useHead({
 
 If you need to modify the default `titleTemplate`, it's recommended to do it through nuxt.config.
 
-```ts [nuxt.config.ts]
+```ts twoslash [nuxt.config.ts]
 export default defineNuxtConfig({
   app: {
     head: {
@@ -74,7 +78,7 @@ export default defineNuxtConfig({
 
 Likewise if you'd like to use a different template for a subset of pages, you can use `useHead`.
 
-```vue [pages/blog/tutorials/how-to-use-titles.vue]
+```vue twoslash [pages/blog/tutorials/how-to-use-titles.vue]
 <script lang="ts" setup>
 useHead({
   templateParams: {

docs/content/0.nuxt-seo/2.guides/3.trailing-slashes.md → content/nuxt-seo/2.seo-guides/3.trailing-slashes.md

@@ -19,7 +19,7 @@ Nuxt SEO allows you to enable global trailing slashes using site config.
 
 This will automatically add trailing slashes to your sitemap, canonical URLs and more.
 
-```ts [nuxt.config.ts]
+```ts twoslash [nuxt.config.ts]
 export default defineNuxtConfig({
   site: {
     trailingSlash: true,

docs/content/0.nuxt-seo/3.api/4.breadcrumbs.md → content/nuxt-seo/3.api/4.breadcrumbs.md

@@ -28,7 +28,7 @@ It's important to do this within the `defineBreadcrumbItems` function, as it wil
 
 If you need to modify the breadcrumb for a specific static route, you can use the `breadcrumb` property of the route meta.
 
-```vue [Page Meta]
+```vue twoslash [Page Meta]
 <script lang="ts" setup>
 definePageMeta({
   breadcrumb: {
@@ -53,7 +53,7 @@ will be removed.
 For example, if you have the path `/blog/my-post` and you want to override the `my-post` segment, we need
 to target the third item in the array.
 
-```ts
+```ts twoslash
 // path: /blog/my-post will generate ['Home', 'Blog', 'My Post']
 useBreadcrumbItems({
   overrides: [
@@ -72,7 +72,9 @@ useBreadcrumbItems({
 
 If you need to add items to the end or beginning of the breadcrumb, you can use the `append` and `prepend` props.
 
-```ts
+```ts twoslash
+import { useBreadcrumbItems } from '#imports'
+
 useBreadcrumbItems({
   append: [
     {

docs/content/0.nuxt-seo/6.migration-guide/0.nuxt-seo-kit.md → content/nuxt-seo/6.migration-guide/0.nuxt-seo-kit.md

@@ -106,6 +106,7 @@ export default defineNuxtConfig({
 ::
 
 When updating your config:
+
 - All keys are without the `site` prefix
 - The `language` config has been renamed to `defaultLocale`
 
@@ -138,6 +139,7 @@ export default defineNuxtConfig({
 ### Nuxt Robots
 
 Upgraded from v1 to v3:
+
 - [v2 release notes](https://github.com/harlan-zw/nuxt-simple-robots/releases/tag/v2.0.0)
 - [v3 release notes](/robots/releases/v3)
 
@@ -146,6 +148,7 @@ No breaking changes.
 ### Nuxt Sitemap
 
 Upgraded from v1 to v3:
+
 - [v2 release notes](https://github.com/nuxt-modules/sitemap/releases/tag/v2.0.0)
 - [v3 release notes](/sitemap/releases/v3)
 
@@ -154,13 +157,15 @@ No breaking changes.
 ### Nuxt Schema.org
 
 Upgraded from v2 to v3:
+
 - [v3 release notes](/schema-org/releases/v3)
 
 No breaking changes.
 
 ### Nuxt OG Image
 
 Upgraded from v1 to v2:
+
 - [v2 release notes](/og-image/releases/v2)
 
 The following options have been removed from nuxt.config `ogImage`:
@@ -183,7 +188,7 @@ If you were referencing the old default template, you will need to update it.
 Composables & Components:
 
 - `defineOgImageStatic()` is deprecated, use `defineOgImage()` (default behaviour is to cache), if you want to be verbose you can use `defineOgImageCached()` or `<OgImageCached />`
--  `<OgImageStatic />` is deprecated, use `<OgImage />`
+- `<OgImageStatic />` is deprecated, use `<OgImage />`
 - `defineOgImageDynamic()` is deprecated, use `defineOgImageWithoutCache()`
 - `<OgImageDynamic />` is deprecated, use `<OgImageWithoutCache />`
 
@@ -216,17 +221,20 @@ defineOgImage({ /* */ })
 ### Nuxt Link Checker
 
 Upgraded from v1 to v2:
+
 - [v2 release notes](/link-checker/releases/v2)
 
 Changes to nuxt.config `linkChecker`:
+
 - `exclude` renamed to `excludeLinks`
 - `failOn404` renamed to `failOnError`
 
-### Nuxt SEO Experiments
+### Nuxt SEO Utils
 
-The `nuxt-unhead` module has been renamed to `nuxt-seo-experiments`. This is to better reflect the scope of the module.
+The `nuxt-unhead` module has been renamed to `nuxt-seo-utils`. This is to better reflect the scope of the module.
 
 Upgraded from v1 to v3:
+
 - [v2 release notes](https://github.com/harlan-zw/nuxt-link-checker/releases/2.0.0)
 - [v2 release notes](/link-checker/releases/v3)
 

content/nuxt-seo/_dir.yml

@@ -0,0 +1 @@
+title: Nuxt SEO

docs/.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

docs/app/app.config.ts

@@ -0,0 +1,23 @@
+export default defineAppConfig({
+  toaster: {
+    position: 'bottom-right' as const,
+    expand: true,
+    duration: 5000,
+  },
+  theme: {
+    radius: 0.1,
+  },
+  ui: {
+    colors: {
+      primary: 'green',
+      gray: 'slate',
+    },
+  },
+  uiPro: {
+    prose: {
+      codeIcon: {
+        'robots.txt': 'vscode-icons:file-type-robots',
+      },
+    },
+  },
+})