refactor: 自动按需导入 pinia api

src/layouts/components/NavigationBar/index.vue

@@ -9,7 +9,6 @@ import ThemeSwitch from "@@/components/ThemeSwitch/index.vue"
 import { useDevice } from "@@/composables/useDevice"
 import { useLayoutMode } from "@@/composables/useLayoutMode"
 import { UserFilled } from "@element-plus/icons-vue"
-import { storeToRefs } from "pinia"
 import { Breadcrumb, Hamburger, Sidebar } from "../index"
 
 const { isMobile } = useDevice()

src/layouts/components/Settings/index.vue

@@ -3,7 +3,6 @@ import { useSettingsStore } from "@/pinia/stores/settings"
 import { useLayoutMode } from "@@/composables/useLayoutMode"
 import { removeLayoutsConfig } from "@@/utils/cache/local-storage"
 import { Refresh } from "@element-plus/icons-vue"
-import { storeToRefs } from "pinia"
 import SelectLayoutMode from "./SelectLayoutMode.vue"
 
 const { isLeft } = useLayoutMode()

src/layouts/index.vue

@@ -4,7 +4,6 @@ import { useDevice } from "@@/composables/useDevice"
 import { useLayoutMode } from "@@/composables/useLayoutMode"
 import { useWatermark } from "@@/composables/useWatermark"
 import { getCssVar, setCssVar } from "@@/utils/css"
-import { storeToRefs } from "pinia"
 import { RightPanel, Settings } from "./components"
 import { useResize } from "./composables/useResize"
 import LeftMode from "./modes/LeftMode.vue"

src/layouts/modes/LeftMode.vue

@@ -3,7 +3,6 @@ import { useAppStore } from "@/pinia/stores/app"
 import { useSettingsStore } from "@/pinia/stores/settings"
 import { useDevice } from "@@/composables/useDevice"
 import { useLayoutMode } from "@@/composables/useLayoutMode"
-import { storeToRefs } from "pinia"
 import { AppMain, NavigationBar, Sidebar, TagsView } from "../components"
 
 const { isMobile } = useDevice()

src/layouts/modes/LeftTopMode.vue

@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import { useAppStore } from "@/pinia/stores/app"
 import { useSettingsStore } from "@/pinia/stores/settings"
-import { storeToRefs } from "pinia"
 import { AppMain, Logo, NavigationBar, Sidebar, TagsView } from "../components"
 
 const appStore = useAppStore()

src/layouts/modes/TopMode.vue

@@ -1,6 +1,5 @@
 <script lang="ts" setup>
 import { useSettingsStore } from "@/pinia/stores/settings"
-import { storeToRefs } from "pinia"
 import { AppMain, Logo, NavigationBar, TagsView } from "../components"
 
 const settingsStore = useSettingsStore()

src/pinia/index.ts

@@ -1,3 +1 @@
-import { createPinia } from "pinia"
-
 export const pinia = createPinia()

src/pinia/stores/app.ts

@@ -1,7 +1,6 @@
 import { pinia } from "@/pinia"
 import { DeviceEnum, SIDEBAR_CLOSED, SIDEBAR_OPENED } from "@@/constants/app-key"
 import { getSidebarStatus, setSidebarStatus } from "@@/utils/cache/local-storage"
-import { defineStore } from "pinia"
 
 interface Sidebar {
   opened: boolean

src/pinia/stores/permission.ts

@@ -3,7 +3,6 @@ import { pinia } from "@/pinia"
 import { constantRoutes, dynamicRoutes } from "@/router"
 import { routerConfig } from "@/router/config"
 import { flatMultiLevelRoutes } from "@/router/helper"
-import { defineStore } from "pinia"
 
 function hasPermission(roles: string[], route: RouteRecordRaw) {
   const routeRoles = route.meta?.roles

src/pinia/stores/settings.ts

@@ -3,7 +3,6 @@ import type { Ref } from "vue"
 import { layoutsConfig } from "@/layouts/config"
 import { pinia } from "@/pinia"
 import { setLayoutsConfig } from "@@/utils/cache/local-storage"
-import { defineStore } from "pinia"
 
 type SettingsStore = {
   // 使用映射类型来遍历 LayoutsConfig 对象的键

src/pinia/stores/tags-view.ts

@@ -1,7 +1,6 @@
 import type { RouteLocationNormalized } from "vue-router"
 import { pinia } from "@/pinia"
 import { getCachedViews, getVisitedViews, setCachedViews, setVisitedViews } from "@@/utils/cache/local-storage"
-import { defineStore } from "pinia"
 import { useSettingsStore } from "./settings"
 
 export type TagView = Partial<RouteLocationNormalized>

src/pinia/stores/user.ts

@@ -3,7 +3,6 @@ import { resetRouter } from "@/router"
 import { routerConfig } from "@/router/config"
 import { getUserInfoApi } from "@@/apis/user"
 import { setToken as _setToken, getToken, removeToken } from "@@/utils/cache/cookies"
-import { defineStore } from "pinia"
 import { useSettingsStore } from "./settings"
 import { useTagsViewStore } from "./tags-view"
 

types/auto/auto-imports.d.ts

@@ -11,12 +11,16 @@ declare global {
   const ElMessage: typeof import('element-plus/es')['ElMessage']
   const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
   const ElNotification: typeof import('element-plus/es')['ElNotification']
+  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']
+  const createPinia: typeof import('pinia')['createPinia']
   const customRef: typeof import('vue')['customRef']
   const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
   const defineComponent: typeof import('vue')['defineComponent']
+  const defineStore: typeof import('pinia')['defineStore']
   const effectScope: typeof import('vue')['effectScope']
+  const getActivePinia: typeof import('pinia')['getActivePinia']
   const getCurrentInstance: typeof import('vue')['getCurrentInstance']
   const getCurrentScope: typeof import('vue')['getCurrentScope']
   const h: typeof import('vue')['h']
@@ -25,6 +29,11 @@ declare global {
   const isReactive: typeof import('vue')['isReactive']
   const isReadonly: typeof import('vue')['isReadonly']
   const isRef: typeof import('vue')['isRef']
+  const mapActions: typeof import('pinia')['mapActions']
+  const mapGetters: typeof import('pinia')['mapGetters']
+  const mapState: typeof import('pinia')['mapState']
+  const mapStores: typeof import('pinia')['mapStores']
+  const mapWritableState: typeof import('pinia')['mapWritableState']
   const markRaw: typeof import('vue')['markRaw']
   const nextTick: typeof import('vue')['nextTick']
   const onActivated: typeof import('vue')['onActivated']
@@ -48,9 +57,12 @@ declare global {
   const readonly: typeof import('vue')['readonly']
   const ref: typeof import('vue')['ref']
   const resolveComponent: typeof import('vue')['resolveComponent']
+  const setActivePinia: typeof import('pinia')['setActivePinia']
+  const setMapStoreSuffix: typeof import('pinia')['setMapStoreSuffix']
   const shallowReactive: typeof import('vue')['shallowReactive']
   const shallowReadonly: typeof import('vue')['shallowReadonly']
   const shallowRef: typeof import('vue')['shallowRef']
+  const storeToRefs: typeof import('pinia')['storeToRefs']
   const toRaw: typeof import('vue')['toRaw']
   const toRef: typeof import('vue')['toRef']
   const toRefs: typeof import('vue')['toRefs']

vite.config.ts

@@ -103,7 +103,7 @@ export default defineConfig(({ mode }) => {
       UnoCSS(),
       // 自动按需导入 API
       AutoImport({
-        imports: ["vue", "vue-router"],
+        imports: ["vue", "vue-router", "pinia"],
         dts: "types/auto/auto-imports.d.ts",
         resolvers: [ElementPlusResolver()]
       }),