完成中文路径拼音转换

Author: LingLambda

astro.config.mjs

@@ -1,17 +1,28 @@
 // @ts-check
-import { defineConfig } from 'astro/config';
+import { defineConfig, envField } from "astro/config";
 
-import tailwindcss from '@tailwindcss/vite';
+import tailwindcss from "@tailwindcss/vite";
 
 // https://astro.build/config
 export default defineConfig({
-  site: 'https://linglambda.github.io',
-  base: '/',
-  
+  site: "https://linglambda.github.io",
+  base: "/",
+
   //悬停预加载
   prefetch: true,
 
   vite: {
     plugins: [tailwindcss()],
   },
-});
+  env: {
+    schema: {
+      PATH_MODULE: envField.enum({
+        values:['no_change','pinyin','pinyin_with_tones'],
+        default: 'pinyin',
+        optional: false,
+        context: "server",
+        access: "secret",
+      }), 
+    },
+  },
+});

post/用javafx和robot类实现截图小工具.md

@@ -1,5 +1,5 @@
 ---
-title: 用javafx和robot类实现截图小工具（未完待续）
+title: 用javafx和robot类实现截图小工具
 date: 2024-6-3 22:31
 description: 用javafx和robot类实现截图小工具
 category: 编程

src/components/TitileCard.astro

@@ -1,8 +1,10 @@
 ---
+import { titleToPinyin } from "../utils/utils";
+
 const { title, date, wordNum } = Astro.props;
 ---
 
-<a class="post-card" href={`/blog/${title}/`}  data-astro-prefetch>
+<a class="post-card" href={`/blog/${titleToPinyin(title)}/`}  data-astro-prefetch>
   <div class="card-top">
     <div class="card-title">{title}</div>
     <div class="word-num">{wordNum}字</div>

src/content.config.ts

@@ -2,7 +2,7 @@
 import { defineCollection, z } from "astro:content";
 
 // 2. 导入加载器
-import { glob, file } from "astro/loaders";
+import { glob } from "astro/loaders";
 
 // 3. 定义你的集合
 const blog = defineCollection({

src/pages/blog/[page].astro

@@ -2,32 +2,42 @@
 import { render } from "astro:content";
 import BaseLayout from "../../layouts/BaseLayout.astro";
 import Prose from "../../components/Prose.astro";
-import { getCollectionOrderByDate, getWordCount } from "../../utils/utils";
+import {
+  getCollectionOrderByDate,
+  getWordCount,
+  titleToPinyin,
+} from "../../utils/utils";
 
 export const getStaticPaths = async () => {
-  const blogs = await getCollectionOrderByDate("blog",({data})=>{
+  const blogs = await getCollectionOrderByDate("blog", ({ data }) => {
     return data.published === true;
   });
   return blogs.map((item) => ({
     params: {
-      page: item.data.title,
+      page: titleToPinyin(item.data.title),
     },
     props: {
       title: item.data.title,
       description: item.data.description,
       date: item.data.date,
-      tags:item.data.tags,
+      tags: item.data.tags,
       fontNum: getWordCount(item.body ? item.body : ""),
       Content: item,
     },
   }));
 };
 
-const { title, description, date, fontNum, Content: rawContent, tags} = Astro.props;
+const {
+  title,
+  description,
+  date,
+  fontNum,
+  Content: rawContent,
+  tags,
+} = Astro.props;
 const { Content } = await render(rawContent);
 const MIN_READ_COUNT = 350;
 const readTimeMin = Math.ceil(fontNum / MIN_READ_COUNT);
-console.log(fontNum);
 ---
 
 <BaseLayout description={description} keywords={tags}>

src/utils/utils.ts

@@ -2,7 +2,6 @@ import {
   getCollection,
   type AnyEntryMap,
   type CollectionEntry,
-  type RenderedContent,
 } from "astro:content";
 
 /**
@@ -21,11 +20,43 @@ export const getCollectionOrderByDate = async <C extends keyof AnyEntryMap>(
   collection: C,
   filter?: (entry: CollectionEntry<C>) => unknown
 ): Promise<CollectionEntry<C>[]> => {
-  const cs:CollectionEntry<C>[] = filter
+  const cs: CollectionEntry<C>[] = filter
     ? await getCollection(collection, filter)
     : await getCollection(collection);
   cs.sort((a, b) => {
     return new Date(b.data.date).getTime() - new Date(a.data.date).getTime();
   });
   return cs;
 };
+
+import { pinyin } from "pinyin-pro";
+const module = import.meta.env.PATH_MODULE; //根据配置修改路径生成规则
+export let titleToPinyin = (title: string) =>
+  title.replaceAll(/\s+/g, "-").replaceAll(/-+/g, "-");
+switch (module) {
+  case "no_change": {
+    break;
+  }
+  case "pinyin": {
+    titleToPinyin = (title: string) =>
+      pinyin(title.replaceAll(/\s+/g, "-"), {
+        toneType: "none",
+        type: "array",
+        nonZh: "consecutive",
+      })
+        .join("-")
+        .replaceAll(/-+/g, "-");
+    break;
+  }
+  case "pinyin_with_tones": {
+    titleToPinyin = (title: string) =>
+      pinyin(title.replaceAll(/\s+/g, "-"), {
+        toneType: "num",
+        type: "array",
+        nonZh: "consecutive",
+      })
+        .join("-")
+        .replaceAll(/-+/g, "-");
+    break;
+  }
+}