Update: 新主题（待完善），目前只支持pc大屏

Author: T-miracle

.vitepress/config.ts

@@ -26,7 +26,9 @@ export default defineConfig({
         resolve: {
             alias: {
                 '@': path.join(__dirname, '../src/'),
-                '@img': path.join(__dirname, '../src/public/images/')
+                '@NanoUI': path.join(__dirname, '../package/components/'),
+                '@NanoIcon': path.join(__dirname, '../package/icon/'),
+                '@store': path.join(__dirname, '../package/store/')
             }
         },
         plugins: [
@@ -45,12 +47,12 @@ export default defineConfig({
     markdown: {
         // 代码块显示行数
         // lineNumbers: true,
-        theme: 'monokai',
+        // theme: 'monokai',
         // lineNumbers: true,
-        // theme: {
-        //     light: 'github-dark',
-        //     dark: 'github-dark'
-        // },
+        theme: {
+            light: 'github-light',
+            dark: 'github-dark'
+        },
         config: (md) => {
             md.use(mathjax3);
             md.use(taskLists);
@@ -88,9 +90,8 @@ export default defineConfig({
             }
         },
         footer: {
-            message: 'Released under the MIT License.',
-            copyright: 'Copyright © 2022-present Tmiracle <br/>' +
-                '<a target="_blank" href="https://beian.miit.gov.cn/#/Integrated/index">桂ICP备2022008261号-1</a>'
+            message: 'Released under the MIT License. <br/> Copyright © 2022-present Tmiracle',
+            copyright: '<a target="_blank" href="https://beian.miit.gov.cn/#/Integrated/index">桂ICP备2022008261号-1</a>'
         },
         socialLinks: [
             { icon: 'github', link: 'https://github.com/T-miracle' },

.vitepress/sidebar/bugs.ts

@@ -17,7 +17,7 @@ const bugsSidebar: DefaultTheme.SidebarItem[] = [
                 items: [
                     {
                         text: '🔹 img 标签加载对象存储图片后再使用 canvas 调用当前图片，导致图片跨域的问题',
-                        link: '/bugs/web/html/canvas-use-object-storage-image-cross-domain.md'
+                        link: '/bugs/web/html/canvas-use-object-storage-image-cross-domain'
                     }
                 ]
             },
@@ -49,7 +49,7 @@ const bugsSidebar: DefaultTheme.SidebarItem[] = [
                     },
                     {
                         text: '🔹 el-form 自定义一个非输入选择的值的规则，但是无法生效的问题',
-                        link: '/bugs/web/element-ui/el-form_customize_rule.md'
+                        link: '/bugs/web/element-ui/el-form_customize_rule'
                     }
                 ]
             },
@@ -59,7 +59,7 @@ const bugsSidebar: DefaultTheme.SidebarItem[] = [
                 items: [
                     {
                         text: '🔹 新安装包覆盖安装，新增加的页面无法跳转',
-                        link: '/bugs/web/uniapp/overwrite_install_newly_added_page_cannot_jump.md'
+                        link: '/bugs/web/uniapp/overwrite_install_newly_added_page_cannot_jump'
                     }
                 ]
             }

.vitepress/sidebar/learn.ts

@@ -37,7 +37,8 @@ const learnSidebar: (DefaultTheme.SidebarItem & { icon?: string })[] = [
     {
         icon: infoIcon,
         text: infoIcon + '关于',
-        link: '/learn/'
+        link: '/learn/',
+        items: []
     },
     {
         text: webIcon + '前端',
@@ -152,32 +153,32 @@ const learnSidebar: (DefaultTheme.SidebarItem & { icon?: string })[] = [
                 text: gitIcon + 'Git',
                 collapsed: true,
                 items: [
-                    { text: '🔸 Git常用命令', link: '/learn/version_control/git/git_common_commands.md' },
+                    { text: '🔸 Git常用命令', link: '/learn/version_control/git/git_common_commands' },
                     {
                         text: '🔸 Git将项目的某个目录分离成新的项目，并保留历史提交信息',
-                        link: '/learn/version_control/git/git_detached_directory_and_keep_historical_submission_records.md'
+                        link: '/learn/version_control/git/git_detached_directory_and_keep_historical_submission_records'
                     }
                 ]
             },
             {
                 text: githubIcon + 'Github',
                 collapsed: true,
                 items: [
-                    { text: '🔹 README 说明文件美化教程', link: '/learn/version_control/github/readme_beautify.md' }
+                    { text: '🔹 README 说明文件美化教程', link: '/learn/version_control/github/readme_beautify' }
                 ]
             },
             {
                 text: npmIcon + 'NPM',
                 collapsed: true,
                 items: [
-                    { text: '🔹 NPM常用命令', link: '/learn/version_control/npm/npm_common_commands.md' },
+                    { text: '🔹 NPM常用命令', link: '/learn/version_control/npm/npm_common_commands' },
                     {
                         text: '🔸 devDependencies 和 dependencies 的区别',
-                        link: '/learn/version_control/npm/the_difference_between_devDependencies_and_dependencies.md'
+                        link: '/learn/version_control/npm/the_difference_between_devDependencies_and_dependencies'
                     },
                     {
                         text: '🔸 NPM 上传开源项目（或插件）',
-                        link: '/learn/version_control/npm/npm_upload_project.md'
+                        link: '/learn/version_control/npm/npm_upload_project'
                     }
                 ]
             }

.vitepress/sidebar/learn/android.ts

@@ -1,10 +1,10 @@
-import {DefaultTheme} from "vitepress/types/default-theme";
+import { DefaultTheme } from 'vitepress/types/default-theme';
 
 const androidItems: DefaultTheme.SidebarItem[] = [
     {
         text: '🔹 通过 APK 反向编译获取 versionCode 和 versionName 等信息',
-        link: '/learn/web/android/get_versioncode_and_versionname_by_apk.md'
+        link: '/learn/web/android/get_versioncode_and_versionname_by_apk'
     }
-]
+];
 
 export default androidItems;

.vitepress/sidebar/learn/css.ts

@@ -5,7 +5,7 @@ const cssItems = [
     { text: '🔹 修改滚动条样式', link: '/learn/web/css/modify_scrollbar_style' },
     { text: '🔹 文本多行自动省略号', link: '/learn/web/css/multiline_text_add_ellipsis' },
     { text: '🔹 font-synthesis属性导致中文斜体不生效的问题', link: '/learn/web/css/font-synthesis_property' },
-    { text: '🔸 设置letter-spacing后文本无法居中的问题', link: '/learn/web/css/set_letter-spacing_text_cant_align_center.md' },
-]
+    { text: '🔸 设置letter-spacing后文本无法居中的问题', link: '/learn/web/css/set_letter-spacing_text_cant_align_center' }
+];
 
 export default cssItems;

.vitepress/sidebar/learn/docker.ts

@@ -1,14 +1,14 @@
-import {DefaultTheme} from "vitepress/types/default-theme";
+import { DefaultTheme } from 'vitepress/types/default-theme';
 
 const dockerItem: DefaultTheme.SidebarItem[] = [
     {
         text: '🔸 CentOS 安装 Docker',
-        link: '/learn/deploy/docker/centos_install_docker.md'
+        link: '/learn/deploy/docker/centos_install_docker'
     },
     {
         text: '🔸 Docker 常用命令',
-        link: '/learn/deploy/docker/docker_common_command.md'
+        link: '/learn/deploy/docker/docker_common_command'
     }
-]
+];
 
 export default dockerItem;

.vitepress/sidebar/learn/hbuilderx.ts

@@ -1,7 +1,7 @@
 import { DefaultTheme } from 'vitepress/types/default-theme';
 
 const hBuilderXItems: DefaultTheme.SidebarItem[] = [
-    { text: '🔹 自用快捷键设置-仿IDEA', link: '/learn/editor/hbuilderx/hot_key_change.md' }
-]
+    { text: '🔹 自用快捷键设置-仿IDEA', link: '/learn/editor/hbuilderx/hot_key_change' }
+];
 
 export default hBuilderXItems;

.vitepress/sidebar/learn/html.ts

@@ -10,8 +10,8 @@ const htmlItems: DefaultTheme.SidebarItem[] = [
         link: '/learn/web/html/the_difference_between_cookie_localstorage_and_sessionstorage',
         collapsed: false,
         items: [
-            {text: '🔥 关于Cookie', link: '/learn/web/html/about_cookie.md'}
+            { text: '🔥 关于Cookie', link: '/learn/web/html/about_cookie' }
         ]
-    },
+    }
 ];
 export default htmlItems;

.vitepress/sidebar/learn/idea.ts

@@ -1,9 +1,9 @@
 import { DefaultTheme } from 'vitepress/types/default-theme';
 
 const ideaItems: DefaultTheme.SidebarItem[] = [
-    { text: '🔹 IDEA 插件收集', link: '/learn/editor/intellij-idea/idea-plugins.md' },
-    { text: '🔹 IDEA 常用快捷键', link: '/learn/editor/intellij-idea/hotkey.md' },
+    { text: '🔹 IDEA 插件收集', link: '/learn/editor/intellij-idea/idea-plugins' },
+    { text: '🔹 IDEA 常用快捷键', link: '/learn/editor/intellij-idea/hotkey' },
     { text: '🔹 多行光标选中并编辑', link: '/learn/editor/intellij-idea/multi_line_cursor_selection_and_editing' }
-]
+];
 
 export default ideaItems;

.vitepress/sidebar/learn/js.ts

@@ -3,14 +3,14 @@ import { DefaultTheme } from 'vitepress/types/default-theme';
 const jsItems: DefaultTheme.SidebarItem[] = [
     {
         text: '🔥 JavaScript中有哪些数据类型？',
-        link: '/learn/web/javascript/type_of_data.md',
+        link: '/learn/web/javascript/type_of_data',
         collapsed: false,
         items: [
             { text: '⭐ 引用类型之间有什么区别', link: '/learn/web/javascript/what_is_the_difference_between_reference_types' }
         ]
     },
-    { text: '🔸 数组的常用遍历函数', link: '/learn/web/javascript/common_traverse_functions_for_array.md' },
-    { text: '🔸 对象数据如何获取第一个属性的值？', link: '/learn/web/javascript/object_get_first_value.md' },
+    { text: '🔸 数组的常用遍历函数', link: '/learn/web/javascript/common_traverse_functions_for_array' },
+    { text: '🔸 对象数据如何获取第一个属性的值？', link: '/learn/web/javascript/object_get_first_value' },
     { text: '🔥 深拷贝和浅拷贝的区别', link: '/learn/web/javascript/the_difference_between_deep_copy_and_shallow_copy' },
     { text: '🔥 什么是闭包？', link: '/learn/web/javascript/what_is_closure' },
     { text: '🔥 谈谈原型与原型链', link: '/learn/web/javascript/prototype_and_prototype_chains' },
@@ -25,8 +25,8 @@ const jsItems: DefaultTheme.SidebarItem[] = [
         link: '/learn/web/javascript/what_is_promise',
         collapsed: false,
         items: [
-            { text: '🔥 什么是回调地狱？', link: '/learn/web/javascript/what_is_callback_hell.md' },
-            { text: '⭐ promise.all()', link: '/learn/web/javascript/promise_all.md' },
+            { text: '🔥 什么是回调地狱？', link: '/learn/web/javascript/what_is_callback_hell' },
+            { text: '⭐ promise.all()', link: '/learn/web/javascript/promise_all' }
         ]
     },
     { text: '🔹 MutationObserver监听DOM', link: '/learn/web/javascript/mutationObserver_listens_to_dom' },