chore: 初始化文件结构

src/App.vue

@@ -0,0 +1,95 @@
+<template>
+  <n-config-provider
+    :date-locale="configProviderProps.dateLocale"
+    :inline-theme-disabled="configProviderProps.inlineThemeDisabled"
+    :locale="configProviderProps.locale"
+  >
+
+    <!-- Naive UI 全局样式 -->
+    <n-global-style></n-global-style>
+
+    <!-- 全局侧边栏 -->
+    <div class="app-aside"></div>
+
+    <!-- 路由页面 -->
+    <router-view class="app-view"></router-view>
+
+  </n-config-provider>
+</template>
+
+<script setup>
+import {
+  NConfigProvider, NGlobalStyle,
+} from 'naive-ui';
+
+import {
+  configProviderProps,
+} from './assets/js/naive-ui';
+</script>
+
+<style lang="less">
+// 全局 CSS 变量
+:root {
+  // 基础颜色
+  --color-black: #252525;
+  --color-gray: #E0E0E0;
+  // 分类颜色
+  --color-bg-dark: #252525;
+  --color-bg-light: #F8F8F8;
+  // 滚动条大小
+  --scrollbar-size: 8px;
+}
+
+// 滚动条
+::-webkit-scrollbar {
+  width: var(--scrollbar-size);
+  height: var(--scrollbar-size);
+}
+::-webkit-scrollbar-corner {
+  display: none;
+}
+::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+::-webkit-scrollbar-thumb {
+  border-radius: 16px;
+  background-color: #CFCFCF;
+
+  &:hover {
+    background-color: #C0C0C0;
+  }
+}
+
+html, body, #app, .n-config-provider {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+html, body {
+  user-select: none;
+  -webkit-tap-highlight-color: transparent;
+}
+html {
+  background-color: #FFF;
+  color: var(--color-black);
+  font-size: 16px;
+}
+
+.n-config-provider {
+  display: flex;
+  flex-direction: row
+}
+
+.app-aside, .app-view {
+  height: 100%;
+}
+
+.app-aside {
+  width: 80px;
+}
+
+.app-view {
+  flex-grow: 1;
+  width: 0;
+}
+</style>

src/assets/js/naive-ui.js

@@ -0,0 +1,13 @@
+import { dateZhCN, zhCN } from 'naive-ui';
+
+/** @type { import('naive-ui').ConfigProviderProps } */
+export const configProviderProps = {
+
+  // 语言
+  dateLocale: dateZhCN,
+  locale: zhCN,
+
+  // 禁用 inline 主题
+  inlineThemeDisabled: true,
+
+};

src/main.js

@@ -0,0 +1,9 @@
+import { createApp } from 'vue';
+import { router } from './router';
+
+import App from './App.vue';
+
+const app = createApp(App);
+
+app.use(router);
+app.mount('#app');

src/router/index.js

@@ -0,0 +1,35 @@
+import { createRouter, createWebHashHistory } from 'vue-router';
+
+import AboutView from '@/views/AboutView/AboutView.vue';
+import IndexView from '@/views/IndexView/IndexView.vue';
+
+export const router = createRouter({
+  history: createWebHashHistory(import.meta.env.BASE_URL),
+  routes: [
+    {
+      path: '/',
+      name: 'IndexView',
+      component: IndexView,
+    },
+    {
+      path: '/about-view',
+      name: 'AboutView',
+      component: AboutView,
+    },
+    {
+      path: '/nav-view',
+      name: 'NavView',
+      component: () => import('@/views/NavView/NavView.vue'),
+    },
+    {
+      path: '/search-view',
+      name: 'SearchView',
+      component: () => import('@/views/SearchView/SearchView.vue'),
+    },
+    {
+      path: '/toolbox-view',
+      name: 'ToolboxView',
+      component: () => import('@/views/ToolboxView/ToolboxView.vue'),
+    },
+  ],
+});

src/views/AboutView/AboutView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="about-view"></div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>

src/views/IndexView/IndexView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="index-view"></div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>

src/views/NavView/NavView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="nav-view"></div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>

src/views/SearchView/SearchView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="search-view"></div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>

src/views/ToolboxView/ToolboxView.vue

@@ -0,0 +1,9 @@
+<template>
+  <div class="toolbox-view"></div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>