fix: give route rules seoMeta and head higher priority

Fixes #27

docs/content/2.guides/3.route-rules.md

@@ -3,37 +3,53 @@ title: SEO Route Rules
 description: Utilise route rules for dynamic SEO meta tags.
 ---
 
-Providing SEO meta tags for dynamic pages at build time can be difficult.
+## Introduction
 
-To make this easier, you can leverage the power of [Route Rules](https://nitro.unjs.io/config#routerules) to provide dynamic SEO meta tags for your pages.
+Sometimes we're dealing with complex page structures which make it difficult to set SEO meta tags appropriately without
+duplication.
 
-## API
+To get around this, you can use build-time [Route Rules](https://nitro.unjs.io/config#routerules) to set dynamic SEO meta tags. This is useful for setting up default meta tags for a specific set of pages, such as a blog or product pages.
 
-### `seoMeta`
+## Usage
+
+Due to the performance implications, route rules are injected within the server runtime based on the route. This means that the properties will not update on client-side navigation,
+you should only use this for data needed by crawlers.
+
+Trying to set default OG Images? Try instead use the [App Icons - Open Graph Images](http://localhost:3000/docs/seo-utils/guides/open-graph-images#opengraph-image).
+
+### `seoMeta`{lang="ts"}
+
+Takes the same input as [useSeoMeta()](https://nuxt.com/docs/api/composables/use-seo-meta#useseometa){lang="ts"}. 
+
+::UAlert {color="info" variant="subtle" title="Infer SEO Meta Plugin" description="You can change the primary color in your app config." icon="i-carbon-information"}
+#description
+
+Nuxt SEO Utils loads the [Infer SEO Meta Plugin](https://unhead.unjs.io/plugins/plugins/infer-seo-meta-tags) from [Unhead](https://unhead.unjs.io/) that will automatically infer SEO meta tags for you based on your content, including `og:title`, `og:description`, `twitter:card`.
+::
 
-This is the same as the [useSeoMeta](https://nuxt.com/docs/api/composables/use-seo-meta#useseometa) input. Check the docs for more details.
 
 ```ts
 export default defineNuxtConfig({
   routeRules: {
     '/blog/**': {
       seoMeta: {
-        ogImage: 'https://example.com'
+        author: 'Harlan Wilton',
       },
     },
   }
 })
 ```
 
-### `head`
+### `head`{lang="ts"}
 
-This is the same as the [useHead](https://nuxt.com/docs/api/composables/use-head#usehead) input. Check the docs for more details.
+Takes the same input as [useHead()](https://nuxt.com/docs/api/composables/use-seo-meta#useseometa){lang="ts"}.
 
 ```ts
 export default defineNuxtConfig({
   routeRules: {
     '/blog/**': {
       head: {
+        // set default icon for blog posts
         link: [
           { rel: 'icon', type: 'image/png', href: '/blog-icon.png' }
         ]
@@ -42,3 +58,22 @@ export default defineNuxtConfig({
   }
 })
 ```
+
+
+## Limitations
+
+Route rules will by default take a `high` priority, meaning that they will override any other meta tags set by the page. You can
+override 
+
+```vue [pages/blog/_slug.vue]
+<script lang="ts" setup>
+usesSeoMeta({
+  description: 'My awesome blog post',
+}, {
+  priority: 'high' // overrides route rules
+})
+</script>
+```
+
+
+

src/runtime/app/plugins/0.routeRules.server.ts

@@ -12,10 +12,10 @@ export default defineNuxtPlugin({
     const event = useRequestEvent()
 
     if (event.context._nitro.routeRules.head)
-      head.push(event.context._nitro.routeRules.head, { mode: 'server' })
+      head.push(event.context._nitro.routeRules.head, { mode: 'server', tagPriority: -9 })
 
     if (event.context._nitro.routeRules.seoMeta) {
-      const meta = unpackMeta({ ...event.context._nitro.routeRules.seoMeta })
+      const meta = unpackMeta({ ...event.context._nitro.routeRules.seoMeta, tagPriority: -9 })
       head.push({
         meta,
       }, { mode: 'server' })