fix:修改任务中ref的ts类型声明;修改打包配置；

src/components/AppTaskMenuList/index.d.ts

@@ -1,10 +1,10 @@
 import type { Ref } from 'vue'
 
-interface Task {
+interface Task<T> {
-  task1: Ref<HTMLElementl>
+  [key: string]: Ref<T>
-  task2: Ref<HTMLElement>
+  // task2: Ref<HTMLElement>
-  task3: Ref<HTMLElement>
+  // task3: Ref<HTMLElement>
-  task4: Ref<HTMLElement>
+  // task4: Ref<HTMLElement>
 }
 interface ListType {
   title: string

src/components/AppTaskMenuList/index.vue

@@ -1,12 +1,13 @@
 <!-- 子菜单列表组件 -->
 <script setup lang="ts">
+import type { ComponentPublicInstance, Ref } from 'vue'
 import { computed, inject, ref } from 'vue'
 import type { Task } from './index.d'
 import { useTaskListStore } from '@/store/moules/taskListStore'
 
 const taskListStore = useTaskListStore()
-const sectionRefs = inject<Task>('sectionRefs')
+const sectionRefs = inject<Task<ComponentPublicInstance>>('sectionRefs')
-const taskContainer = inject('taskContainer')
+const taskContainer = inject<Ref<HTMLElement>>('taskContainer')
 const activeIndex = ref(0)
 
 const list = computed(() => [
@@ -35,9 +36,13 @@ const list = computed(() => [
 function handleClick(index: number, task: string) {
   activeIndex.value = index
 
+  if (!sectionRefs) {
+    return
+  }
+
   const target = sectionRefs[task].value.$el.offsetTop - 40
 
-  taskContainer.value.scrollTo({
+  taskContainer?.value.scrollTo({
     top: target,
     behavior: 'smooth',
   })

src/views/task/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { ComponentPublicInstance, Ref } from 'vue'
 import { provide, ref } from 'vue'
 import { BasicTask } from './components/BasicTask'
 import { NoviceTask } from './components/NoviceTask'
@@ -11,10 +12,10 @@ import { AppSubMenuTitle } from '@/components/AppSubMenuTitle'
 import { AppTaskMenuList } from '@/components/AppTaskMenuList'
 
 const taskContainer = ref(null)
-const task1 = ref(null)
+const task1 = ref<Ref<ComponentPublicInstance> | null>(null)
-const task2 = ref(null)
+const task2 = ref<Ref<ComponentPublicInstance> | null>(null)
-const task3 = ref(null)
+const task3 = ref<Ref<ComponentPublicInstance> | null>(null)
-const task4 = ref(null)
+const task4 = ref<Ref<ComponentPublicInstance> | null>(null)
 const sectionRefs = { task1, task2, task3, task4 }
 provide('sectionRefs', sectionRefs)
 provide('taskContainer', taskContainer)

vite.config.ts

@@ -17,6 +17,8 @@ export default defineConfig({
       symbolId: 'icon-[name]',
     }),
   ],
+  base: './',
+  publicDir: 'public',
   server: {
     host: '0.0.0.0',
   },