Skip to content

Commit 86a0c6b

Browse files
BenbinbinBenbinbin
committed
🐛 fix typescript type warning bugs
1 parent 302e989 commit 86a0c6b

10 files changed

Lines changed: 58 additions & 43 deletions

‎components/CatalogItemForBlog.vue‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,8 @@ const props = defineProps<{
1313
depth: number
1414
}>()
1515
16-
const toggleAllCatalogState = inject<Ref<string>>('toggleAllCatalogState')
17-
const changeToggleAllCatalogState = inject<(value: 'expand' | 'collapse' | '') => void>('changeToggleAllCatalogState')
16+
const toggleAllCatalogState = inject('toggleAllCatalogState') as Ref<'expand' | 'collapse' | ''>
17+
const changeToggleAllCatalogState = inject('changeToggleAllCatalogState') as (value: 'expand' | 'collapse' | '') => void
1818
1919
const expand = ref(true)
2020
@@ -31,7 +31,8 @@ const toggleCatalogHandler = () => {
3131
changeToggleAllCatalogState('')
3232
}
3333
34-
const bgColorMap = {
34+
// 🚨 maybe should fix this "any" type
35+
const bgColorMap:any = {
3536
2: {
3637
expand: 'bg-purple-500',
3738
collapse: 'bg-purple-200',
@@ -59,15 +60,17 @@ const bgColorMap = {
5960
}
6061
}
6162
62-
const textColorMap = {
63+
// 🚨 maybe should fix this "any" type
64+
const textColorMap:any = {
6365
2: 'text-purple-400',
6466
3: 'text-red-400',
6567
4: 'text-green-400',
6668
5: 'text-blue-400',
6769
6: 'text-gray-400'
6870
}
6971
70-
const borderColorMap = {
72+
// 🚨 maybe should fix this "any" type
73+
const borderColorMap:any = {
7174
2: { active: 'border-purple-500', expand: 'border-purple-300', collapse: 'border-purple-100' },
7275
3: { active: 'border-red-500', expand: 'border-red-300', collapse: 'border-red-100' },
7376
4: { active: 'border-green-500', expand: 'border-green-300', collapse: 'border-green-100' },

‎components/CatalogItemForNote.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const props = defineProps<{
1919
const initCollapseHeadings = ref(new Set<string>())
2020
const collapseHeadings = inject('collapseHeadings', initCollapseHeadings)
2121
22-
const toggleCollapseHeadings = inject<(string) => void>('toggleCollapseHeadings')
22+
const toggleCollapseHeadings = inject<(arg0: string) => void>('toggleCollapseHeadings')
2323
2424
/**
2525
*
@@ -117,7 +117,7 @@ watch([sidebarFloatForNote, toggleNoteSidebarFloat, floatNoteCatalogType], () =>
117117
* active heading
118118
*
119119
*/
120-
const setActiveHeadingId = inject<(string) => void>('setActiveHeadingId')
120+
const setActiveHeadingId = inject<(arg0: string) => void>('setActiveHeadingId')
121121
</script>
122122

123123
<template>

‎components/ElementCard.vue‎

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,15 +20,16 @@ const props = defineProps({
2020
2121
const emits = defineEmits(['spanAll'])
2222
23-
const headingElem = ref(null)
23+
const headingElem = ref<HTMLElement | null>(null) // get heading DOM
2424
2525
/**
2626
*
2727
* heading style mapping
2828
*
2929
*/
3030
const headingArr = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6']
31-
const headingColorMap = {
31+
// 🚨 maybe should fix this "any" type
32+
const headingColorMap:any = {
3233
h1: 'text-gray-800',
3334
h2: 'text-purple-500',
3435
h3: 'text-red-500',
@@ -37,7 +38,8 @@ const headingColorMap = {
3738
h6: 'text-gray-500'
3839
}
3940
40-
const headingBtnMap = {
41+
// 🚨 maybe should fix this "any" type
42+
const headingBtnMap:any = {
4143
h1: {
4244
expand: 'text-white bg-gray-500 hover:bg-gray-400 active:bg-gray-500 border-gray-500',
4345
collapse: 'text-gray-400 hover:text-gray-500 active:text-white active:bg-gray-500 border-gray-500'
@@ -64,7 +66,8 @@ const headingBtnMap = {
6466
}
6567
}
6668
67-
const borderColorMap = {
69+
// 🚨 maybe should fix this "any" type
70+
const borderColorMap:any = {
6871
h1: 'border-gray-100',
6972
h2: 'border-purple-100',
7073
h3: 'border-red-100',
@@ -96,10 +99,11 @@ const toggleExpandStateHandler = () => {
9699
*/
97100
const highlightTitle = ref(false)
98101
99-
const activeHeadingId = inject<Ref<string>>('activeHeadingId')
100-
const setActiveHeadingId = inject<(string) => void>('setActiveHeadingId')
102+
const activeHeadingId = inject('activeHeadingId') as Ref<string>
103+
const setActiveHeadingId = inject('setActiveHeadingId') as (arg0: string) => void
101104
102-
const highlightColorMap = {
105+
// 🚨 maybe should fix this "any" type
106+
const highlightColorMap:any = {
103107
h1: 'bg-gray-100',
104108
h2: 'bg-purple-100',
105109
h3: 'bg-red-100',
@@ -139,7 +143,7 @@ const setLayoutHandler = (value: 'waterfall' | 'compact' | 'card') => {
139143
140144
if (headingElem.value) {
141145
nextTick(() => {
142-
headingElem.value.scrollIntoView(true)
146+
headingElem.value?.scrollIntoView(true)
143147
highlightTitle.value = true
144148
const timer = setTimeout(() => {
145149
highlightTitle.value = false
@@ -160,7 +164,7 @@ const toggleLayoutForContent = () => {
160164
// compact layout
161165
const childrenSpanAllNum = ref(0)
162166
163-
const childrenSpanAllHandler = (state) => {
167+
const childrenSpanAllHandler = (state:Boolean) => {
164168
if (state) {
165169
childrenSpanAllNum.value += 1
166170
} else {
@@ -178,7 +182,7 @@ watch(childrenSpanAllNum, (newNum, oldNum) => {
178182
179183
// divide columns
180184
const childrenDivideColumns = ref(1)
181-
const divideColumns = inject<Ref<number>>('divideColumns')
185+
const divideColumns = inject('divideColumns') as Ref<number>
182186
183187
watch(divideColumns, () => {
184188
if (syncChangeColumns.value) {
@@ -207,7 +211,7 @@ onMounted(() => {
207211
}
208212
})
209213
210-
const changeChildrenDivideColumns = (event) => {
214+
const changeChildrenDivideColumns = (event:MouseEvent) => {
211215
if (event.shiftKey) {
212216
childrenDivideColumns.value += 1
213217
} else if (event.ctrlKey || event.metaKey) {

‎components/HeaderNav.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
<script setup lang="ts">
2+
import type { NavItem } from '@nuxt/content/dist/runtime/types'
3+
24
const props = defineProps({
35
headerFlexiMode: {
46
type: Boolean,
@@ -15,7 +17,7 @@ const { data: navTree } = await useAsyncData('rootFolder', () => fetchContentNav
1517
// const articleFolder = data.value[0]
1618
1719
let articleFolder
18-
const categoryArr = []
20+
const categoryArr:NavItem[] = []
1921
2022
if (Array.isArray(navTree.value)) {
2123
articleFolder = navTree.value.find(item => item._path === '/article')
@@ -42,9 +44,9 @@ const getCategory = (path = '') => {
4244
4345
const showSubNav = ref(false)
4446
45-
let timer = null
47+
let timer:(null | ReturnType<typeof setTimeout>) = null
4648
47-
const setSubNav = (show) => {
49+
const setSubNav = (show:boolean) => {
4850
if (show) {
4951
if (timer) {
5052
clearTimeout(timer)
@@ -65,7 +67,7 @@ const setSubNav = (show) => {
6567
/**
6668
* sub transition effect
6769
*/
68-
const onAfterEnter = (el) => {
70+
const onAfterEnter = (el:HTMLElement) => {
6971
el.classList.add('translate-y-full')
7072
}
7173

‎components/MarkdownBlog.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -64,21 +64,21 @@ const showCatalog = useState<Boolean>('showBlogCatalog', () => {
6464
return appConfig.theme.articlePage.showBlogCatalog
6565
})
6666
67-
const article = ref(null)
67+
const article = ref<HTMLElement | null>(null) // get the article DOM
6868
6969
// set active heading
7070
const activeHeadings = ref(new Set<string>())
7171
provide('activeHeadings', activeHeadings)
7272
73-
let observer
73+
let observer:IntersectionObserver
7474
onMounted(() => {
7575
// get headings list
7676
if (article.value) {
7777
const headingDomList = article.value.querySelectorAll('h2, h3, h4, h5, h6')
7878
// set intersection observer
7979
observer = new IntersectionObserver((entries) => {
8080
entries.forEach((entry) => {
81-
const id = entry.target.getAttribute('id')
81+
const id = entry.target.getAttribute('id') as string
8282
if (entry.intersectionRatio > 0) {
8383
activeHeadings.value.add(id)
8484
} else {

‎components/MarkdownNote.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -294,7 +294,7 @@ provide('toggleAllHeadings', toggleAllHeadings)
294294
const activeHeadingId = ref('')
295295
provide('activeHeadingId', activeHeadingId)
296296
297-
const setActiveHeadingId = (id) => {
297+
const setActiveHeadingId = (id:string) => {
298298
activeHeadingId.value = id
299299
}
300300
provide('setActiveHeadingId', setActiveHeadingId)

‎components/PostCardItem.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ const props = defineProps<{
44
listLen: number
55
}>()
66
7-
const getCoverUrl = (relativeURL) => {
7+
const getCoverUrl = (relativeURL:(string)) => {
88
if (relativeURL.startsWith('./')) {
99
const articleFolderPathArr = props.article._path.split('/').slice(0, -1)
1010
const imagePathArr = relativeURL.split('/').slice(1)

‎components/PostListItem.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ const props = defineProps<{
44
article: any
55
}>()
66
7-
const getCoverUrl = (relativeURL) => {
7+
const getCoverUrl = (relativeURL:string) => {
88
if (relativeURL.startsWith('./')) {
99
const articleFolderPathArr = props.article._path.split('/').slice(0, -1)
1010
const imagePathArr = relativeURL.split('/').slice(1)

‎components/SeriesModal.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,10 @@ const showDetail = ref(false)
1515
*
1616
*/
1717
const router = useRouter()
18-
const itemRefs = ref([])
18+
const itemRefs = ref<HTMLElement[]>([])
1919
const itemNum = ref(0)
2020
let currentIndex = -1
21-
const ModalKeyListener = function (event) {
21+
const ModalKeyListener = function (event:KeyboardEvent) {
2222
if (event.key === 'Escape') {
2323
// press Esc key to hide modal
2424
// emits('close')

‎pages/index.vue‎

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<script setup lang="ts">
2+
import type { NavItem } from '@nuxt/content/dist/runtime/types'
23
// import type { QueryBuilderParams } from '@nuxt/content/dist/runtime/types'
34
// import fileTypeMap from '@/utils/fileType.json'
45
@@ -33,8 +34,8 @@ const appConfig = useAppConfig()
3334
*
3435
*/
3536
// Blog Posts
36-
let articleFolder
37-
const articleFolderFiles = []
37+
let articleFolder:(NavItem | undefined)
38+
const articleFolderFiles:NavItem[] = []
3839
3940
// render blog posts or not
4041
let showBlogPosts = true
@@ -76,7 +77,7 @@ const getCategory = (path = '') => {
7677
7778
// hide post section
7879
const hidePostCategorySections = ref(new Set())
79-
const togglePostCategorySectionsHandler = (category) => {
80+
const togglePostCategorySectionsHandler = (category:string) => {
8081
if (hidePostCategorySections.value.has(category)) {
8182
hidePostCategorySections.value.delete(category)
8283
} else {
@@ -90,35 +91,39 @@ const togglePostCategorySectionsHandler = (category) => {
9091
* data in a tree structure
9192
*
9293
*/
93-
const currentTree = ref([])
94+
const currentTree = ref<NavItem[] | null>([])
9495
9596
currentTree.value = navTree.value
9697
97-
let folderNavPath = []
98+
let folderNavPath:number[] = []
9899
99100
const folderNavArr = ref([
100101
{
101102
title: 'Root',
102-
path: []
103+
path: [] as number[]
103104
}
104105
])
105106
106-
const setTreeHandler = (path, type = 'drill-down') => {
107+
const setTreeHandler = (path: number[], type = 'drill-down') => {
107108
if (type === 'drill-down') {
108109
folderNavPath = folderNavPath.concat(path)
109110
} else if (type === 'reset') {
110111
folderNavPath = path
111112
}
112113
113-
let treeTemp = navTree.value
114+
let treeTemp = navTree.value as NavItem[]
114115
116+
// rebuild the folderNavArr
117+
// set the root as start
115118
const folderNavArrTemp = [
116119
{
117120
title: 'Root',
118-
path: []
121+
path: [] as number[]
119122
}
120123
]
121-
let folderNavPathTemp = []
124+
125+
// the start folderNavPath just contain empty array
126+
let folderNavPathTemp:number[] = []
122127
123128
if (folderNavPath.length > 0) {
124129
folderNavPath.forEach((index) => {
@@ -127,16 +132,17 @@ const setTreeHandler = (path, type = 'drill-down') => {
127132
title: treeTemp[index].title,
128133
path: folderNavPathTemp
129134
})
130-
treeTemp = treeTemp[index].children
135+
treeTemp = treeTemp[index].children as NavItem[]
131136
})
132137
}
133138
134139
currentTree.value = treeTemp
135140
folderNavArr.value = folderNavArrTemp
136141
}
137142
138-
const fileTypeMap = useFileTypeMap()
139-
const getFileTypeIcon = (type) => {
143+
const fileTypeMap: any = useFileTypeMap() // 🚨 maybe should fix this "any" type
144+
145+
const getFileTypeIcon = (type:string) => {
140146
const fileType = fileTypeMap.value[type]
141147
142148
if (!fileType) {

0 commit comments

Comments
 (0)