Built the basic ui framework

2026-04-05 15:01:23 +08:00 · 2023-04-29 01:38:45 +08:00
parent a9c51a0d96
commit c512f635b7
30 changed files with 9177 additions and 679 deletions
--- a/ui/vite.config.ts
+++ b/ui/vite.config.ts
@@ -1,7 +1,86 @@
+import { fileURLToPath, URL } from 'node:url'
+
+import path from 'path'
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import AutoImport from 'unplugin-auto-import/vite'
+import IconsResolver from 'unplugin-icons/resolver'
+import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
+import Components from 'unplugin-vue-components/vite'
+import Icons from 'unplugin-icons/vite'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import Inspect from 'vite-plugin-inspect'
+
+const pathSrc = path.resolve(__dirname, 'src')

 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [vue()]
+    plugins: [
+        vue(),
+        AutoImport({
+            // 目标文件
+            include: [
+                /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
+                /\.vue$/,
+                /\.vue\?vue/, // .vue
+                /\.md$/ // .md
+            ],
+            // Auto import functions from Vue, e.g. ref, reactive, toRef...
+            // 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
+            imports: ['vue', 'vue-router'],
+            // eslint报错解决
+            eslintrc: {
+                enabled: false, // Default `false`
+                filepath: '.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
+                globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
+            },
+            // Auto import functions from Element Plus, e.g. ElMessage, ElMessageBox... (with style)
+            // 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
+            resolvers: [
+                // Auto import icon components
+                // 自动导入图标组件
+                IconsResolver({
+                    prefix: 'icon',
+                    alias: {
+                        system: 'system-uicons'
+                    },
+                    enabledCollections: ['ep'],
+                    customCollections: ['pinnacle']
+                }),
+                ElementPlusResolver()
+            ],
+
+            dts: path.resolve(pathSrc, 'auto-imports.d.ts')
+        }),
+        Components({
+            resolvers: [
+                IconsResolver({
+                    prefix: 'icon',
+                    alias: {
+                        system: 'system-uicons'
+                    },
+                    enabledCollections: ['ep'],
+                    customCollections: ['pinnacle']
+                }),
+                ElementPlusResolver()
+            ],
+
+            dts: path.resolve(pathSrc, 'components.d.ts')
+        }),
+        Icons({
+            compiler: 'vue3',
+            autoInstall: true,
+            customCollections: {
+                pinnacle: FileSystemIconLoader('src/assets/svg', (svg) =>
+                    svg.replace(/^svg /, '<svg fill="currentColor"')
+                )
+            }
+        }),
+        Inspect()
+    ],
+    resolve: {
+        alias: {
+            '@': fileURLToPath(new URL('./src', import.meta.url))
+        }
+    }
 })