README.md

@@ -60,25 +60,27 @@
 - 执行 pnpm newpost '文章标题' 创建新文章，并在 src/content/posts/ 目录中编辑
 - 参考官方指南将博客部署至 Vercel, Netlify,Cloudflare Pages, GitHub Pages 等
 
-### Vercel 自动部署
+### ⚠️ Hexo 迁移 Astro 方法
+
+> `Hexo` 的部署、使用、自动化部署等方法 完全适用于 `Astro`，只需要将 `Hexo` 博客的 `src/_posts/` 目录下的文章文件迁移至 `Astro` 目录下的 `src/content/blog/` 目录下即可，然后自定义 `src/config.ts` 配置文件去自定义博客。<br> 此时，你已成功迁移 Hexo 博客至 Astro 博客！
+
+### 自动部署
+
+**Vercel 部署：**
 
 [![vhAstro-Theme](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https://github.com/uxiaohan/vhAstro-Theme)
 
-### Cloudflare Pages 自动部署
-
-[![vhAstro-Theme](https://deploy.workers.cloudflare.com/button)](https://dash.cloudflare.com/?to=/:account/workers-and-pages/create/deploy-to-workers&repository=https://github.com/uxiaohan/vhAstro-Theme)
-
 ### 使用命令拉取模板
 
 ```bash
-# 使用 pnpm
+# pnpm
-pnpm create astro@latest --template uxiaohan/vhAstro-Theme astro-blog
+pnpm create astro@latest --template uxiaohan/vhAstro-Theme
-# 或者 yarn
+
-yarn create astro --template uxiaohan/vhAstro-Theme astro-blog
+# yarn
-# 或者 npm
+yarn create astro --template uxiaohan/vhAstro-Theme
-npm create astro@latest -- --template uxiaohan/vhAstro-Theme astro-blog
+
-# 进入项目目录
+# npm
-cd astro-blog
+npm create astro@latest -- --template uxiaohan/vhAstro-Theme
 ```
 
 ### 本地开发
@@ -94,10 +96,6 @@ pnpm build
 pnpm newpost '文章标题'
 ```
 
-### ⚠️ Hexo 迁移 Astro 方法
-
-> 将 `Hexo` 博客的 `src/_posts/` 目录下的文章文件，复制到 `Astro` 的 `src/content/blog/` 目录下即可，然后自定义 `src/config.ts` 配置文件去自定义博客。<br>⚠️ `Hexo` 的部署、使用、自动化部署等方法 完全适用于 `Astro` 博客！<br>🎉 此时，你已成功迁移 Hexo 博客至 Astro 博客！
-
 ## 🍬 特色页面
 
 ### 友情链接

package.json

@@ -12,13 +12,13 @@
     "ondev": "astro preferences enable devToolbar"
   },
   "dependencies": {
-    "@astrojs/mdx": "^4.2.6",
+    "@astrojs/mdx": "^4.2.3",
     "@astrojs/rss": "^4.0.11",
-    "@astrojs/sitemap": "^3.4.0",
+    "@astrojs/sitemap": "^3.3.0",
     "@swup/astro": "^1.6.0",
     "aplayer": "^1.10.1",
-    "astro": "^5.7.12",
+    "astro": "^5.6.0",
-    "overlayscrollbars": "^2.11.2",
+    "overlayscrollbars": "^2.11.1",
     "vanilla-lazyload": "^19.1.3",
     "vh-plugin": "^1.2.2"
   },
@@ -26,10 +26,10 @@
     "@playform/compress": "^0.1.9",
     "@types/dplayer": "^1.25.5",
     "@types/nprogress": "^0.2.3",
-    "@waline/client": "^3.5.7",
+    "@waline/client": "^3.5.6",
     "cheerio": "^1.0.0",
     "dayjs": "^1.11.13",
-    "less": "^4.3.0",
+    "less": "^4.2.2",
     "mdast-util-to-string": "^4.0.0",
     "reading-time": "^1.5.0",
     "rehype-katex": "^7.0.1",
@@ -37,7 +37,7 @@
     "remark-directive": "^4.0.0",
     "remark-math": "^6.0.0",
     "remark-sectionize": "^2.1.0",
-    "typescript": "^5.8.3",
+    "typescript": "^5.8.2",
     "unist-util-visit": "^5.0.0"
   },
   "pnpm": {

script/newpost.js

@@ -15,7 +15,8 @@ if (!articleName) {
 const ArticleContent = `---
 title: "${articleName.replace(/"/g, '\\"')}"
 categories: 分类
-tags: ['标签']
+tags:
+  - 标签
 id: "${articleID.slice(0, 16)}"
 date: ${dayjs().format('YYYY-MM-DD HH:mm:ss')}
 cover: "封面图URL (为空默认随机内置封面 /public/assets/images/banner)"

src/components/ArticleCard/ArticleCard.astro

@@ -1,4 +1,5 @@
 ---
+import { Image } from "astro:assets";
 import { getDescription, fmtTime } from "@/utils/index";
 const { post } = Astro.props;
 // 获取文章的摘要
@@ -10,14 +11,16 @@ const ARTICLE_COVER: string = await getCover(post.data.cover);
 import "./ArticleCard.less";
 ---
 
-<article class={`vh-article-item vh-animation vh-animation-init vh-article-link${post.data.top ? " active" : ""}`}>
+<article class="vh-article-item vh-animation vh-animation-init">
-	<section class="vh-article-banner"><img src="/assets/images/lazy-loading.webp" data-vh-lz-src={ARTICLE_COVER} alt={post.data.title} /></section>
+	<a class={`vh-article-link${post.data.top ? " active" : ""}`} href={`/article/${post.data.id}`}>
-	<header>
+		<section class="vh-article-banner"><Image src="/assets/images/lazy-loading.webp" data-vh-lz-src={ARTICLE_COVER} alt={post.data.title} width="1" height="1" /></section>
-		<h3><a class={`vh-article-cat vh-cat-${post.data.categories}`} href={`/categories/${post.data.categories}`}>{post.data.categories}</a><time>{fmtTime(post.data.date)}</time></h3>
+		<section class="vh-article-desc">
-		<h1 class="title"><a class="vh-ellipsis" href={`/article/${post.data.id}`}>{post.data.title}</a></h1>
+			<header>
-	</header>
+				<span class={`vh-article-cat vh-cat-${post.data.categories}`}>{post.data.categories}</span>
-	<h2 class="vh-article-excerpt vh-ellipsis line-2">{description}</h2>
+				<h2 class="title vh-ellipsis">{post.data.title}</h2>
-	<h4 class="vh-article-taglist vh-ellipsis">
+			</header>
-		{post.data.tags.map((tag: string) => <a href={`/tag/${tag}`}>{tag}</a>)}
+			<p class="vh-article-excerpt vh-ellipsis line-2">{description}</p>
-	</h4>
+			<footer>{fmtTime(post.data.date)}</footer>
+		</section>
+	</a>
 </article>

src/components/ArticleCard/ArticleCard.less

@@ -16,10 +16,7 @@
     overflow: hidden;
 
     &>.vh-article-item {
-      position: relative;
       box-sizing: border-box;
-      display: flex;
-      flex-direction: column;
       width: 100%;
       height: initial;
       min-height: max-content;
@@ -28,207 +25,173 @@
       background-color: #fff;
       overflow: hidden;
 
-      &:hover {
+      &>a.vh-article-link {
-        &>.vh-article-banner {
-          &>img {
-            transform: scale(1.08);
-          }
-        }
-      }
-
-      &.active {
-        &::before {
-          content: "置顶";
-          position: absolute;
-          top: 1.6rem;
-          left: 0.66rem;
-          box-sizing: border-box;
-          padding: 0.18rem 1rem;
-          width: max-content;
-          height: max-content;
-          font-size: 1rem;
-          color: #fff;
-          border-radius: 0.66rem;
-          transform: rotate(-45deg);
-          /* 确保元素有半透明背景 */
-          background: #00000033;
-          box-shadow: 0 2rem 1rem rgba(0, 0, 0, 0.1);
-          z-index: 1;
-          /* 高斯模糊效果 */
-          backdrop-filter: blur(6px);
-          -webkit-backdrop-filter: blur(6px);
-          /* 兼容旧版浏览器 */
-        }
-
-        &>.vh-article-banner {
-          &::before {
-            content: '';
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-            background: rgba(0, 0, 0, 0.06);
-            z-index: 1;
-            pointer-events: none;
-          }
-        }
-      }
-
-
-      &>.vh-article-banner {
-        flex-shrink: 0;
         position: relative;
         box-sizing: border-box;
-        width: 100%;
-        height: 12rem;
-        overflow: hidden;
-
-        &>img {
-          width: 100%;
-          height: 100%;
-          object-fit: cover;
-        }
-      }
-
-      &>header {
-        box-sizing: border-box;
-        padding: 0.88rem 1.166rem;
         display: flex;
         flex-direction: column;
-        gap: 0.66rem;
         width: 100%;
         height: max-content;
+        min-height: 100%;
+        border-radius: 0.618rem;
+        overflow: hidden;
+        transition: background 0.18s;
 
-        &>h3 {
+        &:hover {
-          display: flex;
+          &>.vh-article-banner {
-          align-self: center;
+            &>img {
-          justify-content: space-between;
+              transform: scale(1.08);
-          width: 100%;
-          height: max-content;
-
-          &>.vh-article-cat {
-            flex-shrink: 0;
-            box-sizing: border-box;
-            width: max-content;
-            font-size: 0.875rem;
-            font-weight: 700;
-            /* 默认渐变色起始 */
-            --gradient-color-1: #a32cc4;
-            /* 默认渐变色中间 */
-            --gradient-color-2: #b65fcf;
-            /* 默认渐变色结束 */
-            --gradient-color-3: #e39ff6;
-            background: linear-gradient(118deg, var(--gradient-color-1), var(--gradient-color-2) 26%, var(--gradient-color-3));
-            background-clip: text;
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
-            color: transparent;
-
-            &.vh-cat-Code {
-              /* 默认渐变色起始 */
-              --gradient-color-1: #f48600;
-              /* 默认渐变色中间 */
-              --gradient-color-2: #ffa12e;
-              /* 默认渐变色结束 */
-              --gradient-color-3: #ffe9c9;
             }
-
-            &.vh-cat-Daily {
-              /* 默认渐变色起始 */
-              --gradient-color-1: #6270ee;
-              /* 默认渐变色中间 */
-              --gradient-color-2: #2b90d9;
-              /* 默认渐变色结束 */
-              --gradient-color-3: #37dede;
-            }
-
-            &.vh-cat-Software {
-              /* 默认渐变色起始 */
-              --gradient-color-1: #006633;
-              /* 默认渐变色中间 */
-              --gradient-color-2: #00cc66;
-              /* 默认渐变色结束 */
-              --gradient-color-3: #66ff99;
-            }
-
-            &.vh-cat-Share {
-              /* 默认渐变色起始 */
-              --gradient-color-1: rgb(240, 45, 133);
-              /* 默认渐变色中间 */
-              --gradient-color-2: #f95ba5;
-              /* 默认渐变色结束 */
-              --gradient-color-3: #f4bdd0;
-            }
-          }
-
-          &>time {
-            box-sizing: border-box;
-            margin-top: auto;
-            font-size: 0.805rem;
-            font-weight: 400;
-            color: var(--vh-font-color);
-            width: max-content;
           }
         }
 
-        &>.title {
+        &.active {
+          &::before {
+            content: "置顶";
+            position: absolute;
+            top: 1.6rem;
+            left: 0.66rem;
+            box-sizing: border-box;
+            padding: 0.18rem 1rem;
+            width: max-content;
+            height: max-content;
+            font-size: 1rem;
+            color: #fff;
+            border-radius: 0.66rem;
+            transform: rotate(-45deg);
+            /* 确保元素有半透明背景 */
+            background: #00000033;
+            box-shadow: 0 2rem 1rem rgba(0, 0, 0, 0.1);
+            z-index: 1;
+            /* 高斯模糊效果 */
+            backdrop-filter: blur(6px);
+            -webkit-backdrop-filter: blur(6px);
+            /* 兼容旧版浏览器 */
+          }
+
+          &>.vh-article-banner {
+            &::before {
+              content: '';
+              position: absolute;
+              top: 0;
+              left: 0;
+              width: 100%;
+              height: 100%;
+              background: rgba(0, 0, 0, 0.06);
+              z-index: 1;
+              pointer-events: none;
+            }
+          }
+        }
+
+
+        &>.vh-article-banner {
+          flex-shrink: 0;
+          position: relative;
           box-sizing: border-box;
           width: 100%;
-          height: max-content;
+          height: 12rem;
           overflow: hidden;
 
-          &>a {
+          &>img {
-            font-size: 1.06rem;
+            width: 100%;
-            font-weight: 600;
+            height: 100%;
-            transition: color 0.18s;
+            object-fit: cover;
-
-            &:hover {
-              color: var(--vh-main-color);
-            }
           }
         }
-      }
-
-      &>.vh-article-excerpt {
-        box-sizing: border-box;
-        padding: 0 1.166rem;
-        width: 100%;
-        height: max-content;
-        color: var(--vh-font-66);
-        font-size: 0.805rem;
-        font-weight: 400;
-        letter-spacing: 0.88px;
-        line-height: 1.28rem;
-      }
 
 
-      &>.vh-article-taglist {
+        &>.vh-article-desc {
-        margin-top: auto;
+          flex: 1;
-        box-sizing: border-box;
-        padding: 0.66rem 1.166rem 1rem;
-        width: 100%;
-        height: max-content;
-        overflow: hidden;
-
-        &>a {
           box-sizing: border-box;
-          margin-right: 0.88rem;
+          padding: 1.188rem;
-          color: var(--vh-font);
+          display: flex;
-          font-size: 0.688rem;
+          flex-direction: column;
-          font-weight: 400;
+          width: 100%;
-          transition: color 0.18s;
+          height: 100%;
+          min-height: max-content;
+          overflow: hidden;
 
-          &:hover {
+          &>header {
-            color: var(--vh-main-color);
+            display: flex;
+            flex-direction: column;
+            gap: 0.36rem;
+
+            &>.vh-article-cat {
+              box-sizing: border-box;
+              width: max-content;
+              font-size: 0.875rem;
+              font-weight: 700;
+              /* 默认渐变色起始 */
+              --gradient-color-1: #a32cc4;
+              /* 默认渐变色中间 */
+              --gradient-color-2: #b65fcf;
+              /* 默认渐变色结束 */
+              --gradient-color-3: #e39ff6;
+              background: linear-gradient(118deg, var(--gradient-color-1), var(--gradient-color-2) 26%, var(--gradient-color-3));
+              background-clip: text;
+              -webkit-background-clip: text;
+              -webkit-text-fill-color: transparent;
+              color: transparent;
+
+              &.vh-cat-Code {
+                /* 默认渐变色起始 */
+                --gradient-color-1: #f48600;
+                /* 默认渐变色中间 */
+                --gradient-color-2: #ffa12e;
+                /* 默认渐变色结束 */
+                --gradient-color-3: #ffe9c9;
+              }
+
+              &.vh-cat-Daily {
+                /* 默认渐变色起始 */
+                --gradient-color-1: #6270ee;
+                /* 默认渐变色中间 */
+                --gradient-color-2: #2b90d9;
+                /* 默认渐变色结束 */
+                --gradient-color-3: #37dede;
+              }
+
+              &.vh-cat-Software {
+                /* 默认渐变色起始 */
+                --gradient-color-1: #006633;
+                /* 默认渐变色中间 */
+                --gradient-color-2: #00cc66;
+                /* 默认渐变色结束 */
+                --gradient-color-3: #66ff99;
+              }
+
+              &.vh-cat-Share {
+                /* 默认渐变色起始 */
+                --gradient-color-1: rgb(240, 45, 133);
+                /* 默认渐变色中间 */
+                --gradient-color-2: #f95ba5;
+                /* 默认渐变色结束 */
+                --gradient-color-3: #f4bdd0;
+              }
+            }
+
+            &>.title {
+              font-size: 1.06rem;
+              font-weight: 600;
+              line-height: 1.36;
+            }
           }
 
-          &::before {
+          &>.vh-article-excerpt {
-            content: "#";
+            margin: 0.88rem 0;
+            width: 100%;
+            height: max-content;
+            color: var(--vh-font-66);
+            font-size: 0.805rem;
+            letter-spacing: 0.88px;
+            line-height: 1.28rem;
           }
 
-          &:nth-last-of-type(1) {
+          &>footer {
-            margin-right: 0;
+            margin-top: auto;
+            font-size: 0.805rem;
+            color: var(--vh-font-color);
           }
         }
       }

src/components/Aside/Aside.astro

@@ -2,6 +2,7 @@
 // 静态图片
 // Svg 组件
 import Svg from "@/components/Svg/Svg.astro";
+import { Image } from "astro:assets";
 // 时间处理
 import { fmtTime } from "@/utils/index";
 // 获取用户配置数据
@@ -13,7 +14,7 @@ import { getCategories, getTags, getRecommendArticles, getCountInfo } from "@/ut
 // 分类列表
 const categories = getCategories();
 // 热门标签
-const tags = getTags();
+const tags = getTags().slice(0, 16);
 // 获取网站统计数据
 const CountInfo = getCountInfo();
 // 最新文章
@@ -29,7 +30,7 @@ import "./Aside.less";
 	{
 		AsideShow.WebSitesShow && (
 			<section class="vh-aside-item user">
-				<img class="vh-aside-avatar" src="/assets/images/lazy-loading.webp" data-vh-lz-src={Avatar} alt={Author} />
+				<Image class="vh-aside-avatar" src="/assets/images/lazy-loading.webp" data-vh-lz-src={Avatar} alt={Author} width="1" height="1" />
 				<span class="vh-aside-auther">{Author}</span>
 				<p class="vh-aside-motto">{Motto}</p>
 				<section class="vh-aside-links">

src/components/Aside/Aside.less

@@ -138,11 +138,11 @@ aside.vh-aside {
 
         &>.count {
           box-sizing: border-box;
-          padding: 0.88rem 0 0.66rem;
+          padding: 1rem 0 0;
           display: flex;
           flex-direction: column;
           justify-content: center;
-          gap: 0.28rem;
+          gap: 0.66rem;
           text-align: center;
           background: var(--vh-white-color);
           border-radius: var(--vh-main-radius);
@@ -205,10 +205,6 @@ aside.vh-aside {
         p {
           padding: 0.28rem 0;
         }
-
-        img {
-          max-width: 100%;
-        }
       }
     }
 
@@ -273,9 +269,7 @@ aside.vh-aside {
         gap: 0.68rem 1rem;
         width: 100%;
         height: max-content;
-        max-height: 18.88rem;
+        overflow: hidden;
-        overflow-x: hidden;
-        overflow-y: auto;
 
         &>a {
           display: flex;

src/components/Footer/Footer.astro

@@ -1,11 +1,13 @@
 ---
+// 静态图片
+import { Image } from "astro:assets";
 // 基础 样式
 import "./Footer.less";
 ---
 
 <footer class="vh-footer">
 	<main>
-		<p><img src="/assets/images/footer/ing.svg" alt="韩小韩" /><span><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path fill="#fff" d="M269.4 2.9C265.2 1 260.7 0 256 0s-9.2 1-13.4 2.9L54.3 82.8c-22 9.3-38.4 31-38.3 57.2c.5 99.2 41.3 280.7 213.6 363.2c16.7 8 36.1 8 52.8 0C454.7 420.7 495.5 239.2 496 140c.1-26.2-16.3-47.9-38.3-57.2L269.4 2.9zM144 221.3c0-33.8 27.4-61.3 61.3-61.3c16.2 0 31.8 6.5 43.3 17.9l7.4 7.4 7.4-7.4c11.5-11.5 27.1-17.9 43.3-17.9c33.8 0 61.3 27.4 61.3 61.3c0 16.2-6.5 31.8-17.9 43.3l-82.7 82.7c-6.2 6.2-16.4 6.2-22.6 0l-82.7-82.7c-11.5-11.5-17.9-27.1-17.9-43.3z"></path></svg><cite>稳定运行</cite><em class="web_time"></em></span><a href="https://analytics.vvhan.com" target="_blank" rel="noopener noreferrer"><img alt="HanAnalytics" src="/assets/images/footer/hananalytics.svg" /></a></p>
+		<p><Image src="/assets/images/footer/ing.svg" alt="韩小韩" width="1" height="1" /><span><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"> <path fill="#fff" d="M269.4 2.9C265.2 1 260.7 0 256 0s-9.2 1-13.4 2.9L54.3 82.8c-22 9.3-38.4 31-38.3 57.2c.5 99.2 41.3 280.7 213.6 363.2c16.7 8 36.1 8 52.8 0C454.7 420.7 495.5 239.2 496 140c.1-26.2-16.3-47.9-38.3-57.2L269.4 2.9zM144 221.3c0-33.8 27.4-61.3 61.3-61.3c16.2 0 31.8 6.5 43.3 17.9l7.4 7.4 7.4-7.4c11.5-11.5 27.1-17.9 43.3-17.9c33.8 0 61.3 27.4 61.3 61.3c0 16.2-6.5 31.8-17.9 43.3l-82.7 82.7c-6.2 6.2-16.4 6.2-22.6 0l-82.7-82.7c-11.5-11.5-17.9-27.1-17.9-43.3z"></path></svg><cite>稳定运行</cite><em class="web_time"></em></span><a href="https://analytics.vvhan.com" target="_blank" rel="noopener noreferrer"><Image width="1" height="1" alt="HanAnalytics" src="/assets/images/footer/hananalytics.svg" /></a></p>
-		<p><a href="https://astro.build/" target="_blank" rel="noopener noreferrer"><img alt="Astro" src="/assets/images/footer/astro.svg" /></a><a href="https://github.com/uxiaohan/vhAstro-Theme" target="_blank" rel="noopener noreferrer"><img alt="vhAstro-Theme" src="/assets/images/footer/theme.svg" /></a><a href="/sitemap-index.xml" target="_blank"><img alt="sitemap" src="/assets/images/footer/sitemap.svg" /></a><a href="/rss.xml" target="_blank"><img alt="rss" src="/assets/images/footer/rss.svg" /></a><a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener noreferrer"><img alt="icp" src="/assets/images/footer/icp.svg" /></a></p>
+		<p><a href="https://astro.build/" target="_blank" rel="noopener noreferrer"><Image width="1" height="1" alt="Astro" src="/assets/images/footer/astro.svg" /></a><a href="https://github.com/uxiaohan/vhAstro-Theme" target="_blank" rel="noopener noreferrer"><Image width="1" height="1" alt="vhAstro-Theme" src="/assets/images/footer/theme.svg" /></a><a href="/sitemap-index.xml" target="_blank"><Image width="1" height="1" alt="sitemap" src="/assets/images/footer/sitemap.svg" /></a><a href="/rss.xml" target="_blank"><Image width="1" height="1" alt="rss" src="/assets/images/footer/rss.svg" /></a><a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener noreferrer"><Image width="1" height="1" alt="icp" src="/assets/images/footer/icp.svg" /></a></p>
 	</main>
 </footer>

src/components/Head/Head.astro

@@ -10,9 +10,8 @@ const WebTitle = Title || SiteName;
 const SiteCover = Site + Cover;
 const WebCover = PageCover || SiteCover;
 // Schema.org 结构化数据（JSON-LD）
-const WebSiteData = { "@context": "https://schema.org", "@type": "WebSite", url: canonicalURL, name: WebTitle, description: Description, inLanguage: "zh-CN", image: WebCover, publisher: { "@type": "Organization", name: WebTitle, logo: { "@type": "ImageObject", url: SiteCover } } };
+const WebSiteData = { "@context": "https://schema.org", "@type": "WebSite", name: WebTitle, url: canonicalURL, image: { "@type": "ImageObject", url: SiteCover } };
-const ArticleData = { "@context": "https://schema.org", "@type": "BlogPosting", mainEntityOfPage: { "@type": "WebPage", "@id": canonicalURL }, headline: WebTitle, description: Description, image: [WebCover], datePublished: new Date().toISOString().replace("Z", `+08:00`), dateModified: new Date().toISOString().replace("Z", `+08:00`), author: { "@type": "Person", name: Author, url: Site }, publisher: { "@type": "Organization", name: SiteName, logo: { "@type": "ImageObject", url: SiteCover } }, keywords: (Keywords || ["Astro", "分享", "博客"]).join(", ") };
+const ArticleData = { "@context": "https://schema.org", "@type": "BlogPosting", mainEntityOfPage: { "@type": "WebPage", "@id": canonicalURL }, headline: WebTitle, image: [WebCover], author: { "@type": "Person", name: Author, url: Site }, publisher: { "@type": "Organization", name: SiteName, logo: { "@type": "ImageObject", url: SiteCover } } };
-
 // 基础 样式
 import "@/styles/Base.less";
 ---

src/components/MainHeader/MainHeader.astro

@@ -8,7 +8,5 @@ import "./MainHeader.less";
 		<img src="/assets/images/lazy-loading.webp" data-vh-lz-src={SITE_INFO.Avatar} alt="avatar" />
 	</div>
 	<h3 class="auther">{SITE_INFO.Author || "-"}</h3>
-{Array.isArray(SITE_INFO.TypeWriteList) && SITE_INFO.TypeWriteList.length > 0 && (
 	<p class="desc"></p>
-)}
+</div>
-</div>

src/components/Reward/Reward.astro

@@ -3,23 +3,7 @@ import SITE_INFO from "@/config";
 import "./Reward.less";
 ---
 
-{
+<section class="vh-reward">
-	SITE_INFO.Reward.AliPay && SITE_INFO.Reward.WeChat && (
+	<p>喜欢这篇文章嘛，觉得文章不错的话，奖励奖励我！</p>
-		<section class="vh-reward">
+	<div class="reward-list"><span class="alipay"><img src={SITE_INFO.Reward.AliPay} alt="支付宝打赏" />支付宝</span><span class="wechat"><img src={SITE_INFO.Reward.WeChat} alt="微信打赏" /> 微信</span></div>
-			<p>喜欢这篇文章嘛，觉得文章不错的话，奖励奖励我！</p>
+</section>
-			<div class="reward-list">
-				{SITE_INFO.Reward.AliPay && (
-					<span class="alipay">
-						<img src={SITE_INFO.Reward.AliPay} alt="支付宝打赏" />
-						支付宝
-					</span>
-				)}
-				{SITE_INFO.Reward.WeChat && (
-					<span class="wechat">
-						<img src={SITE_INFO.Reward.WeChat} alt="微信打赏" /> 微信
-					</span>
-				)}
-			</div>
-		</section>
-	)
-}

src/config.ts

@@ -122,12 +122,6 @@ export default {
     // 微信收款码
     WeChat: '/assets/images/wechat.webp'
   },
-  // 访问网页 自动推送到搜索引擎
-  SeoPush: {
-    enable: false,
-    serverApi: '',
-    paramsName: 'url'
-  },
   // 页面阻尼滚动速度
   ScrollSpeed: 666
 }

src/content.config.ts

@@ -10,7 +10,7 @@ const blog = defineCollection({
 		date: z.coerce.date(),
 		updated: z.coerce.date().optional(),
 		categories: z.string(),
-		tags: z.array(z.union([z.string(), z.number()])).optional(),
+		tags: z.array(z.union([z.string(), z.number()])),
 		id: z.union([z.string(), z.number()]),
 		cover: z.string().optional(),
 		recommend: z.boolean().optional(),

src/content/blog/Astro主题优雅的vhAstro-Theme.md

@@ -68,39 +68,42 @@ top: true
 
 ## 🚀 使用方法
 
-### 使用 Github 模板
-
 - 使用此模板 [生成新仓库或 Fork 此仓库](https://github.com/new?template_name=vhAstro-Theme&template_owner=uxiaohan)
 - 进行本地开发，Clone 新的仓库，执行 `pnpm install` 以安装依赖
-- 若未安装 [pnpm](https://pnpm.io)，执行 `npm install -g pnpm`
+- 若未安装 pnpm，执行 `npm install -g pnpm`
 - 通过配置文件 `src/config.ts` 自定义博客
 - 执行 pnpm newpost '文章标题' 创建新文章，并在 src/content/posts/ 目录中编辑
 - 参考官方指南将博客部署至 Vercel, Netlify,Cloudflare Pages, GitHub Pages 等
+- 部署前需编辑 `astro.config.mjs` 中的站点设置。
 
-### Vercel 自动部署
+### ⚠️ Hexo 迁移 Astro 方法
 
-::btn[Vercel 一键部署]{link="https://vercel.com/new/clone?repository-url=https://github.com/uxiaohan/vhAstro-Theme"}
+> `Hexo` 的部署、使用、自动化部署等方法 完全适用于 `Astro`，只需要将 `Hexo` 博客的 `src/_posts/` 目录下的文章文件迁移至 `Astro` 目录下的 `src/content/blog/` 目录下即可，然后自定义 `src/config.ts` 配置文件去自定义博客。<br> 此时，你已成功迁移 Hexo 博客至 Astro 博客！
 
-### Cloudflare Pages 自动部署
 
-::btn[Cloudflare Pages 一键部署]{link="https://dash.cloudflare.com/?to=/:account/workers-and-pages/create/deploy-to-workers&repository=https://github.com/uxiaohan/vhAstro-Theme" type="warning"}
+## 📄 文章格式
 
-其他更多部署方式（简简单单闭眼部署），请参考 [Astro 官方文档](https://docs.astro.build/en/guides/integrations-guide/cloudflare/)。
+```md
-
+---
-### 使用命令拉取模板
+title: 标题
-
+categories: 分类
-```bash
+tags:
-# 使用 pnpm
+  - 标签1
-pnpm create astro@latest --template uxiaohan/vhAstro-Theme astro-blog
+  - 标签2
-# 或者 yarn
+id: 文章ID
-yarn create astro --template uxiaohan/vhAstro-Theme astro-blog
+date: 文章创建日期
-# 或者 npm
+updated: 文章更新日期
-npm create astro@latest -- --template uxiaohan/vhAstro-Theme astro-blog
+cover: "封面图URL (为空默认随机内置封面 /public/assets/images/banner)"
-# 进入项目目录
+recommend: false # 是否推荐文章
-cd astro-blog
+top: false # 是否置顶文章
+hide: false # 是否隐藏文章
+<!-- 页面独有 -->
+type: "links" # 页面类型
+comment: false # 关闭页面评论（默认开启）
+---
 ```
 
-### 本地开发
+## 💻 命令
 
 ```bash
 # 安装依赖
@@ -113,16 +116,6 @@ pnpm build
 pnpm newpost '文章标题'
 ```
 
-### ⚠️ Hexo 迁移 Astro 方法
-
-:::note{type="success"}
-将 `Hexo` 博客的 `src/_posts/` 目录下的文章文件，复制到 `Astro` 的 `src/content/blog/` 目录下即可，然后自定义 `src/config.ts` 配置文件去自定义博客。
-
-⚠️ `Hexo` 的部署、使用、自动化部署等方法 完全适用于 `Astro` 博客！
-
-🎉 此时，你已成功迁移 Hexo 博客至 Astro 博客！
-:::
-
 ## 🍬 特色页面
 
 ### 友情链接
@@ -208,29 +201,6 @@ export default {
 }
 ```
 
-## 📄 文章格式
-
-```md
----
-title: 标题
-categories: 分类
-tags:
-  - 标签1
-  - 标签2
-id: 文章ID
-date: 文章创建日期
-updated: 文章更新日期
-cover: "封面图URL (为空默认随机内置封面 /public/assets/images/banner)"
-recommend: false # 是否推荐文章
-top: false # 是否置顶文章
-hide: false # 是否隐藏文章
-<!-- 页面独有 -->
-type: "links" # 页面类型
-comment: false # 关闭页面评论（默认开启）
----
-```
-
-
 ## ✅ Lighthouse
 
 ![vhAstro-Theme-Lighthouse](https://uxiaohan.github.io/v2/2025/03/1742543844078.svg)
@@ -658,9 +628,9 @@ $\cup$、$\cap$、$\in$、$\notin$、$\ni$、$\subset$、$\subseteq$、$\supset$
 ::vhLivePhoto{photo="https://static.vvhan.com/img/2.webp" video="https://static.vvhan.com/img/2.mp4"}
 ```
 
-::vhLivePhoto{photo="/assets/livephoto/1.webp" video="/assets/livephoto/1.mp4" type="y"}
+::vhLivePhoto{photo="/public/assets/livephoto/1.webp" video="/public/assets/livephoto/1.mp4" type="y"}
 
-::vhLivePhoto{photo="/assets/livephoto/2.webp" video="/assets/livephoto/2.mp4"}
+::vhLivePhoto{photo="/public/assets/livephoto/2.webp" video="/public/assets/livephoto/2.mp4"}
 
 ### Music 组件
 

src/content/blog/从Hexo到Astro博客1分钟迁移指南.md

@@ -1,77 +0,0 @@
----
-title: "从Hexo到Astro博客1分钟迁移指南"
-categories: Share
-tags: ["Hexo", "Astro", "静态博客", "迁移"]
-id: "hexo-to-astro-1-minute-migration-guide"
-date: 2025-04-07 17:20:46
-cover: "https://i0.wp.com/uxiaohan.github.io/v2/2025/04/1744018738123.webp"
----
-
-:::note{type="info"}
-🎉 本文将介绍如何将 Hexo 博客迁移到 Astro 博客，只需要 1 分钟即可完成！
-
-作为 `Hexo` 的长期用户，我在 2024 年开始尝试 `Astro`，`Hexo` 基于模板引擎（EJS/Swig）的字符串拼接，而 `Astro` 采用基于 `Vite` 的组件化构建体系。`Hexo` 在 `hexo generate` 时完成全量渲染，`Astro` 在 `astro build` 时执行 `SSG`（静态站点生成）+ `ISR`（增量静态再生）。
-
-`Astro` 的组件化架构、按需加载，构建速度、`Vite` 驱动，热更新速度快等现代化开发体验 深深吸引了我！
-:::
-
-### 项目结构对比
-
-| Hexo         | Astro            | 说明         |
-| ------------ | ---------------- | ------------ |
-| \_config.yml | src/config.ts    | 配置文件     |
-| source       | src/content/blog | 主内容目录   |
-| themes       | src/components   | 组件目录     |
-| public       | public           | 静态资源目录 |
-
-## 迁移步骤详解
-
-### 1. 初始化 Astro 项目
-
-```bash
-# 创建美妙的 Astro 项目
-npm create astro@latest --template uxiaohan/vhAstro-Theme astro-blog
-# 进入项目目录
-cd astro-blog
-# 安装依赖
-npm install
-# 本地预览
-npm run dev
-```
-
-### 迁移文章内容
-
-:::note{type="success"}
-将 `Hexo` 博客的 `src/_posts/` 目录下的文章文件，复制到 `Astro` 的 `src/content/blog/` 目录下即可，然后自定义 `src/config.ts` 配置文件去自定义博客。
-
-⚠️ `Hexo` 的部署、使用、自动化部署等方法 完全适用于 `Astro` 博客！
-
-🎉 此时，你已成功迁移 Hexo 博客至 Astro 博客！
-:::
-
-### Vercel 自动部署
-
-::btn[Vercel 一键部署]{link="https://vercel.com/new/clone?repository-url=https://github.com/uxiaohan/vhAstro-Theme"}
-
-### Cloudflare Pages 自动部署
-
-::btn[Cloudflare Pages 一键部署]{link="https://dash.cloudflare.com/?to=/:account/workers-and-pages/create/deploy-to-workers&repository=https://github.com/uxiaohan/vhAstro-Theme" type="warning"}
-
-其他更多部署方式（简简单单闭眼部署），请参考 [Astro 官方文档](https://docs.astro.build/en/guides/integrations-guide/cloudflare/)。
-
-### 迁移后性能对比
-
-| 指标            | Hexo  | Astro | 提升 |
-| --------------- | ----- | ----- | ---- |
-| 构建时间        | 12.3s | 5.1s  | 58%↑ |
-| Lighthouse 性能 | 89    | 100   | 12%↑ |
-| 页面大小        | 145KB | 23KB  | 84%↓ |
-
-### 总结
-
-迁移到 Astro 后，我的技术博客实现了：
-
-- ✅ 构建速度提升 2.4 倍
-- ✅ 页面性能评分全满分
-- ✅ 开发体验现代化
-- ✅ 扩展能力显著增强

src/layouts/PageLayout/PageLayout.astro

@@ -3,6 +3,8 @@ const { frontmatter } = Astro.props;
 // 页面 Info
 import SITE_CONFIG from "@/config";
 const { Description, Title } = SITE_CONFIG;
+// Aside组件
+import Aside from "@/components/Aside/Aside.astro";
 // 公共 Layout
 import Layout from "@/layouts/Layout/Layout.astro";
 // 评论组件

src/layouts/ToolLayout/ToolLayout.astro

@@ -3,6 +3,8 @@ const { frontmatter } = Astro.props;
 // 页面 Info
 import SITE_CONFIG from "@/config";
 const { Description, Title } = SITE_CONFIG;
+// Aside组件
+import Aside from "@/components/Aside/Aside.astro";
 // 公共 Layout
 import Layout from "@/layouts/Layout/Layout.astro";
 // 评论组件

src/pages/archives/index.astro

@@ -7,6 +7,8 @@ import SITE_CONFIG from "@/config";
 const { Description } = SITE_CONFIG;
 // 公共 Layout
 import Layout from "@/layouts/Layout/Layout.astro";
+// Aside组件
+import Aside from "@/components/Aside/Aside.astro";
 // 文章列表组件
 import Archive from "@/components/Archive/Archive.astro";
 ---

src/pages/article/[...article].astro

@@ -56,9 +56,9 @@ import "@/styles/ArticleBase.less";
 		</header>
 		<main>
 			<Content />
-			<section class="tag-list">
+			<nav class="tag-list">
 				{
-					(post.data.tags || []).map((i: any) => (
+					post.data.tags.map((i: any) => (
 						<a href={`/tag/${i}`}>
 							<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
 								<path stroke="none" d="M0 0h24v24H0z" fill="none" />
@@ -69,11 +69,11 @@ import "@/styles/ArticleBase.less";
 						</a>
 					))
 				}
-			</section>
+			</nav>
 		</main>
 		<footer>
 			<!-- 打赏组件 -->
-			{SITE_CONFIG.Reward && (SITE_CONFIG.Reward.AliPay || SITE_CONFIG.Reward.WeChat) && <Reward />}
+			<Reward />
 			<!-- 版权©️信息 -->
 			<Copyright site={Site} id={post.data.id} title={post.data.title} sitename={Title} time={fmtTime(post.data.date, "YYYY-MM-DD A")} auther={Author} />
 			<!-- 底部谷歌广告 -->

src/pages/robots.txt.ts

@@ -1,7 +1,9 @@
 import type { APIRoute } from 'astro';
 
 const getRobotsTxt = (sitemapURL: URL) => `User-agent: *
-Allow: /
+Disallow: /MineWeb/
+Disallow: /assets/
+Disallow: /*?*
 
 Sitemap: ${sitemapURL.href}`;
 

src/pages/tag/[...tags].astro

@@ -4,7 +4,7 @@ import { getCollection } from "astro:content";
 export async function getStaticPaths(): Promise<any> {
 	const posts = await getCollection("blog");
 	let tagList: any = [];
-	posts.forEach(post => (tagList = [...tagList, ...(post.data.tags || [])]));
+	posts.forEach(post => (tagList = [...tagList, ...post.data.tags]));
 	return [...new Set(tagList)].map(tags => ({ params: { tags } }));
 }
 // 获取分类列表
@@ -15,6 +15,8 @@ import SITE_CONFIG from "@/config";
 const { Description } = SITE_CONFIG;
 // 公共 Layout
 import Layout from "@/layouts/Layout/Layout.astro";
+// Aside组件
+import Aside from "@/components/Aside/Aside.astro";
 // 文章列表组件
 import Archive from "@/components/Archive/Archive.astro";
 ---

src/scripts/Comment.ts

@@ -1,11 +1,3 @@
-/*
- * @Author: Han
- * @Date: 2025-04-07 11:31:34
- * @LastEditors: Han
- * @LastEditTime: 2025-04-21 14:32:19
- * @Description: 
- * 
- */
 import SITE_INFO from "@/config";
 import { LoadScript } from "@/utils/index";
 declare const twikoo: any;
@@ -33,7 +25,6 @@ const WalineFn = async (commentDOM: string, walineInit: any) => {
       "https://registry.npmmirror.com/@waline/emojis/1.3.0/files/tieba/tieba_awkward.png",
       "https://registry.npmmirror.com/@waline/emojis/1.3.0/files/tieba/tieba_sleep.png",
     ],
-    requiredMeta: ['nick', 'mail'],
     imageUploader: async (file: any) => {
       const body = new FormData();
       body.append('file', file);

src/scripts/GoogleSeoPush.ts

@@ -0,0 +1,4 @@
+import { $POST } from '@/utils/index'
+export default async () => {
+  await $POST('https://vh-api.4ce.cn/api/seoPush', { url: window.location.href.replace(/\/$/, '') }, { 'Content-Type': 'application/json; charset=utf-8' })
+}

src/scripts/Init.ts

@@ -36,7 +36,7 @@ import GoogleAdInit from "@/scripts/GoogleAd";
 // Han Analytics 统计
 import HanAnalyticsInit from "@/scripts/HanAnalytics";
 //  谷歌 SEO 推送
-import SeoPushInit from "@/scripts/SeoPush";
+import GoogleSEOInit from "@/scripts/GoogleSeoPush";
 // SmoothScroll 滚动优化
 import SmoothScroll from "@/scripts/Smoothscroll";
 
@@ -74,7 +74,7 @@ const indexInit = async (only: boolean = true) => {
   // Google 广告
   GoogleAdInit();
   // 谷歌 SEO 推送
-  SeoPushInit();
+  GoogleSEOInit();
   // 文章评论初始化
   checkComment() && commentInit(checkComment(), commentLIst)
   // Han Analytics 统计

src/scripts/SeoPush.ts

@@ -1,6 +0,0 @@
-import SITE_INFO from '@/config'
-import { $POST } from '@/utils/index'
-export default async () => {
-  if (!SITE_INFO.SeoPush.enable) return;
-  await $POST(SITE_INFO.SeoPush.serverApi, { [SITE_INFO.SeoPush.paramsName]: window.location.href.replace(/\/$/, '') }, { 'Content-Type': 'application/json; charset=utf-8' })
-}

src/scripts/TypeWrite.ts

@@ -2,8 +2,7 @@ import SITE_INFO from '@/config';
 export default () => {
   const writeDom = document.querySelector('.header-main>.desc');
   if (!writeDom) return;
-  const TypeWriteList: any = SITE_INFO.TypeWriteList;
+  const TypeWriteList = SITE_INFO.TypeWriteList;
-  if (!Array.isArray(TypeWriteList) || !TypeWriteList.length) return writeDom.remove();
   let TypeWriteListIndex = 0;
   let index = 0;
   let isDeleting = false;

src/styles/Article.less

@@ -25,15 +25,10 @@ article.vh-article-main {
     }
 
     &>.article-meta {
-      box-sizing: border-box;
       display: flex;
       align-items: center;
       gap: 0.88rem;
       font-size: 0.85rem;
-      width: 100%;
-      height: 0.98rem;
-      overflow: hidden;
-
 
       &>.article-meta-item {
         display: flex;
@@ -45,7 +40,6 @@ article.vh-article-main {
           flex-shrink: 0;
           height: 0.888rem;
           width: auto;
-          object-fit: contain;
         }
 
         &>time {

src/styles/Base.less

@@ -50,6 +50,8 @@
 	// 隐藏滚动条
 	scrollbar-width: none;
 	-ms-overflow-style: none;
+	// 平滑滚动
+	scroll-behavior: smooth;
 	// 去除下划线
 	text-decoration: none;
 	// 消除边框

src/utils/getArchive.ts

@@ -25,7 +25,7 @@ const getCategoriesList = async (categories: string) => {
 // 获取标签下的文章列表
 const getTagsList = async (tags: string) => {
   const posts = await getCollection("blog");
-  const articleList = posts.filter((i: any) => (i.data.tags || []).map((_i: any) => (String(_i))).includes(tags)).sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());
+  const articleList = posts.filter((i: any) => i.data.tags.includes(tags)).sort((a, b) => b.data.date.valueOf() - a.data.date.valueOf());;
   return fmtArticleList(articleList);
 }
 

src/utils/getPostInfo.ts

@@ -17,7 +17,7 @@ const getCountInfo = () => {
 // 获取文章标签
 const getTags = () => {
   const tagList = posts.reduce((acc: any, i: any) => {
-    (i.data.tags || []).forEach((tag: string) => {
+    i.data.tags.forEach((tag: string) => {
       acc[tag] = (acc[tag] || 0) + 1;
     });
     return acc;