style: 🎨 lint them all

Author: BeiyanYunyi

README.md

@@ -48,8 +48,8 @@ export default {
 ## 调试说明
 
 1. 修改文件后在仓库根目录下进行构建
-    - `pnpm i`
-    - `pnpm build`
+   - `pnpm i`
+   - `pnpm build`
 2. 切换到 example 路径下预览
-    - `cd example`
-    - `pnpm dev`
+   - `cd example`
+   - `pnpm dev`

example/docs/.vitepress/config.ts

@@ -1,6 +1,5 @@
 import type { SidebarOptions } from '@project-trans/vitepress-theme-project-trans/theme'
 import type { ThemeContext } from '@project-trans/vitepress-theme-project-trans/utils'
-import type { DefaultTheme } from 'vitepress'
 import genConfig from '@project-trans/vitepress-theme-project-trans/config'
 import { withThemeContext } from '@project-trans/vitepress-theme-project-trans/utils'
 

example/docs/.vitepress/theme/style.css

@@ -43,7 +43,7 @@
  *   in custom container, badges, etc.
  * -------------------------------------------------------------------------- */
 
- :root {
+:root {
   --vp-c-default-1: var(--vp-c-gray-1);
   --vp-c-default-2: var(--vp-c-gray-2);
   --vp-c-default-3: var(--vp-c-gray-3);
@@ -99,28 +99,14 @@
 
 :root {
   --vp-home-hero-name-color: transparent;
-  --vp-home-hero-name-background: -webkit-linear-gradient(
-    120deg,
-    #eaacb8 30%,
-    #47caff
-  );
-
-  --vp-home-hero-image-background-image: linear-gradient(
-    -45deg,
-    #e6a3b0 30%,
-    #ffffff 50%,
-    #47caff 70%
-  );
+  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #eaacb8 30%, #47caff);
+
+  --vp-home-hero-image-background-image: linear-gradient(-45deg, #e6a3b0 30%, #ffffff 50%, #47caff 70%);
   --vp-home-hero-image-filter: blur(44px);
 }
 
 .dark:root {
-  --vp-home-hero-image-background-image: linear-gradient(
-    -45deg,
-    #eaacb8 30%,
-    #47caff 50%,
-    #eaacb8 75%
-  );
+  --vp-home-hero-image-background-image: linear-gradient(-45deg, #eaacb8 30%, #47caff 50%, #eaacb8 75%);
 }
 
 @media (min-width: 640px) {
@@ -161,4 +147,4 @@
 /* 文档两端对齐 */
 .vp-doc {
   text-align: justify;
-}
+}

package.json

@@ -2,7 +2,7 @@
   "name": "@project-trans/vitepress-theme-project-trans",
   "type": "module",
   "version": "0.6.0",
-  "packageManager": "pnpm@9.10.0+sha512.73a29afa36a0d092ece5271de5177ecbf8318d454ecd701343131b8ebc0c1a91c487da46ab77c8e596d6acf1461e3594ced4becedf8921b074fbd8653ed7051c",
+  "packageManager": "pnpm@9.15.0+sha512.76e2379760a4328ec4415815bcd6628dee727af3779aaa4c914e3944156c4299921a89f976381ee107d41f12cfa4b66681ca9c718f0668fa0831ed4c6d8ba56c",
   "description": "A VitePress theme made with ❤️ by project-trans",
   "license": "MIT",
   "repository": {

src/components.ts

@@ -8,9 +8,9 @@ import PageInfo from './components/PageInfo.vue'
 import ReadingTime from './components/ReadingTime.vue'
 
 export {
+  AppearanceToggle,
   AppFooter,
   AppSBox,
-  AppearanceToggle,
   ArticlesMenu,
   CopyrightInfo,
   HomeContent,

src/components/AppFooter.vue

@@ -1,16 +1,16 @@
 <script setup lang="ts">
+import type { PjtsThemeConfig } from '../config'
 import { NolebaseGitChangelog } from '@nolebase/vitepress-plugin-git-changelog/client'
 import { useData, useRoute } from 'vitepress'
 import { ref, watch } from 'vue'
 import { AppSBox } from '../components'
-import type { PjtsThemeConfig } from '../config'
 
 const route = useRoute()
 const { theme } = useData<PjtsThemeConfig>()
 
 // 定义一个 ref 来存储动态 key
 const componentKey = ref(0)
-const frontmatter = ref({})
+const frontmatter = ref<Record<string, any>>({})
 const isFrontmatterLoaded = ref(false)
 
 // 更新 key 和 frontmatter 的函数

src/components/AppearanceToggle.vue

@@ -10,7 +10,7 @@ function enableTransitions() {
   return isSSR
     ? false
     : 'startViewTransition' in document
-    && window.matchMedia('(prefers-reduced-motion: no-preference)').matches
+      && window.matchMedia('(prefers-reduced-motion: no-preference)').matches
 }
 
 provide('toggle-appearance', async ({ clientX: x, clientY: y }: MouseEvent) => {

src/components/CopyrightInfo.vue

@@ -1,19 +1,18 @@
 <script setup lang="ts">
-import { ref, watch, computed } from 'vue'
-import { useRoute } from 'vitepress' // 获取路由信息
 import type { Node, Trie } from '../plugins/CopyrightLoader.data'
+import { useData, useRoute } from 'vitepress' // 获取路由信息
+import { computed, ref, watch } from 'vue'
 import { data } from '../plugins/CopyrightLoader.data'
-import { useData } from 'vitepress';
-const orgName = useData().theme.value.org;
 
+const orgName = useData().theme.value.org
 
 // 初始化需要更新的变量
 const attrs = ref<Record<string, any> | null>(null)
 
 const route = useRoute() // 获取当前路由对象
 
 // 定义一个函数，基于当前路由路径更新数据
-const updateData = () => {
+function updateData() {
   const paths = route.path.replace('.md', '').split('/').filter((item: string) => item !== '')
   attrs.value = searchClosestInTrie(data, paths)
 }
@@ -23,10 +22,12 @@ function searchClosestInTrie(
   path: string[],
   node: Node<Record<string, any>> = that.root,
 ): Record<string, any> | null {
-  if (path.length === 0) return node.value
+  if (path.length === 0)
+    return node.value
   if (path[0] in node.children) {
     let value = searchClosestInTrie(that, path.slice(1), node.children[path[0]])
-    if (value === null) value = node.value
+    if (value === null)
+      value = node.value
     return value
   }
   return node.value
@@ -51,17 +52,19 @@ watch(
   () => {
     updateData() // 路由变化时调用更新逻辑
   },
-  { immediate: true } // 确保在初次加载时也能更新数据
+  { immediate: true }, // 确保在初次加载时也能更新数据
 )
 </script>
 
 <template>
   <div v-if="attrs?.copyright?.enable ?? false">
     <div class="tip custom-block">
-      <p class="custom-block-title">Copyright</p>
+      <p class="custom-block-title">
+        Copyright
+      </p>
       <p>
         <span>这篇文章 </span>
-        <span>{{ `“${attrs.title}”` }}</span>
+        <span>{{ `“${attrs!.title}”` }}</span>
         <span> 由 </span>
         <a v-if="attrs?.copyright?.url" :href="attrs.copyright.url">{{ displayAuthors }}</a>
         <span v-else>{{ displayAuthors }}</span>
@@ -79,7 +82,7 @@ watch(
           许可下使用
         </span>
         <span v-else-if="attrs?.copyright?.license">
-          ，Project Trans 在 
+          ，Project Trans 在
           <a v-if="attrs?.copyright?.licenseUrl" :href="attrs.copyright.licenseUrl">{{ attrs.copyright.license }}</a>
           <span v-else>{{ attrs.copyright.license }}</span>
           许可下使用

src/plugins/fontSwitcher.js renamed to src/plugins/fontSwitcher.ts

@@ -9,10 +9,10 @@ export const fontMap = {
   '思源宋体': 'Source Han Serif CN',
   '黑体': 'sans',
   '宋体': 'serif',
-}
+} as const
 
 // 字体切换函数
-export function switchFont(font) {
+export function switchFont(font: keyof typeof fontMap) {
   document.documentElement.style.setProperty('--main-font', fontMap[font])
 }
 
@@ -27,9 +27,9 @@ export function addFontSwitchListener() {
     item.addEventListener('click', (e) => {
       e.preventDefault()
       const target = e.target
-      const selectedFont = target.textContent // 获取点击的字体名称
+      const selectedFont = (target as HTMLAnchorElement).textContent // 获取点击的字体名称
       // console.log(`${selectedFont}`);
-      switchFont(selectedFont) // 切换字体
+      switchFont(selectedFont as keyof typeof fontMap) // 切换字体
     })
   })
 
@@ -44,9 +44,9 @@ export function addFontSwitchListener() {
         item.addEventListener('click', (e) => {
           e.preventDefault()
           const target = e.target
-          const selectedFont = target.textContent // 获取点击的字体名称
+          const selectedFont = (target as HTMLAnchorElement).textContent // 获取点击的字体名称
           // console.log(`${selectedFont}`);
-          switchFont(selectedFont) // 切换字体
+          switchFont(selectedFont as keyof typeof fontMap) // 切换字体
         })
       })
     })

src/sidebar.ts

@@ -8,7 +8,7 @@ import { useThemeContext } from './utils/themeContext'
 
 export function generateSidebar() {
   const { sidebarOptions } = useThemeContext()
-  const optionMap: Map<string, VitePressSidebarOptions> = new Map(sidebarOptions.map(obj => [obj.resolvePath.toString(), obj]));
+  const optionMap: Map<string, VitePressSidebarOptions> = new Map(sidebarOptions.map(obj => [obj.resolvePath!.toString(), obj]))
   const sidebar = genSidebar(sidebarOptions)
   for (const key in sidebar) {
     const sidebarMultiItem: SidebarMultiItem = (sidebar as any)[key]

src/style.css

@@ -1,6 +1,5 @@
 @import 'https://fonts.project-trans.org/fonts.css';
 :root {
-    --vp-font-family-base: var(--main-font) !important;/* 文本字体 */
-    --vp-font-family-mono: var(--main-font) !important;/* 代码字体 */
+  --vp-font-family-base: var(--main-font) !important; /* 文本字体 */
+  --vp-font-family-mono: var(--main-font) !important; /* 代码字体 */
 }
-  

src/theme.ts

@@ -1,25 +1,25 @@
-// https://vitepress.dev/guide/custom-theme
 import type { Theme } from 'vitepress'
-import DefaultTheme from 'vitepress/theme-without-fonts'
-import './style.css'
-
+import type Options from 'vitepress-sidebar'
+// https://vitepress.dev/guide/custom-theme
 import {
   NolebaseEnhancedReadabilitiesPlugin,
 } from '@nolebase/vitepress-plugin-enhanced-readabilities/client'
+
 import {
   NolebaseGitChangelogPlugin,
 } from '@nolebase/vitepress-plugin-git-changelog/client'
-import type Options from 'vitepress-sidebar'
+import DefaultTheme from 'vitepress/theme-without-fonts'
+import { onMounted } from 'vue'
+
+import Layout from './Layout.vue'
+import { addFontSwitchListener } from './plugins/fontSwitcher.js'
+import './style.css'
 
 import '@nolebase/vitepress-plugin-enhanced-readabilities/client/style.css'
+
 import '@nolebase/vitepress-plugin-git-changelog/client/style.css'
 import '@nolebase/vitepress-plugin-highlight-targeted-heading/client/style.css'
 
-import Layout from './Layout.vue'
-
-import { onMounted } from 'vue'
-import { addFontSwitchListener } from './plugins/fontSwitcher'
-
 export type SidebarOptions = Options
 
 export default {
@@ -42,7 +42,7 @@ export default {
   },
   setup() {
     onMounted(() => {
-      addFontSwitchListener(); // 添加字体切换的事件监听器
-    });
+      addFontSwitchListener() // 添加字体切换的事件监听器
+    })
   },
 } satisfies Theme

src/utils/themeContext.ts

@@ -1,5 +1,5 @@
 import type { DefaultTheme } from 'vitepress'
-import type { generateSidebar, VitePressSidebarOptions } from 'vitepress-sidebar'
+import type { VitePressSidebarOptions } from 'vitepress-sidebar'
 import { AsyncLocalStorage } from 'node:async_hooks'
 
 type NavConfig = DefaultTheme.Config['nav']