主题
SEO 优化
useSeoMeta
useSeoMeta 组合函数允许你将站点的 SEO 元标签定义为一个扁平的对象，并提供完整的 TypeScript 支持。
vue
<script setup lang="ts">
useSeoMeta({
title: '我的神奇网站',
ogTitle: '我的神奇网站',
description: '这是我的神奇网站，让我来告诉你关于它的一切。',
ogDescription: '这是我的神奇网站，让我来告诉你关于它的一切。',
ogImage: 'https://example.com/image.png',
twitterCard: 'summary_large_image',
})
</script><head> 管理
在每个页面上，设置默认 <head> 配置。
示例
json
{
"app": {
"head": {
"meta": [
// <meta name="viewport" content="width=device-width, initial-scale=1">
{ "name": "viewport", "content": "width=device-width, initial-scale=1" }
],
"script": [
// <script src="https://myawesome-lib.js"></script>
{ "src": "https://awesome-lib.js" }
],
"link": [
// <link rel="stylesheet" href="https://myawesome-lib.css">
{ "rel": "stylesheet", "href": "https://awesome-lib.css" }
],
// please note that this is an area that is likely to change
"style": [
// <style>:root { color: red }</style>
{ "textContent": ":root { color: red }" }
],
"noscript": [
// <noscript>JavaScript is required</noscript>
{ "textContent": "JavaScript is required" }
]
}
}
}设置 html Attrs：
json
{
"app": {
"head": {
"htmlAttrs": {
"lang": "zh-CN"
}
}
}
}