fix: menu error

Author: sheepzh

package.json

@@ -53,7 +53,7 @@
         "postcss": "^8.5.4",
         "postcss-loader": "^8.1.1",
         "postcss-rtlcss": "^5.7.1",
-        "puppeteer": "^24.9.0",
+        "puppeteer": "^24.10.0",
         "sass": "^1.89.1",
         "sass-loader": "^16.0.5",
         "style-loader": "^4.0.0",
@@ -67,7 +67,7 @@
     "dependencies": {
         "@element-plus/icons-vue": "^2.3.1",
         "@vueuse/core": "^13.3.0",
-        "countup.js": "^2.8.2",
+        "countup.js": "^2.9.0",
         "echarts": "^5.6.0",
         "element-plus": "2.9.11",
         "js-base64": "^3.7.7",

rspack/rspack.prod.ts

@@ -36,6 +36,6 @@ const option = optionGenerator({ outputPath, manifest, mode: "production" })
 const { plugins = [] } = option
 plugins.push(filemanagerPlugin)
 option.plugins = plugins
-option.devtool = false
+// option.devtool = false
 
 export default option

src/pages/app/components/HelpUs/index.tsx

@@ -4,31 +4,33 @@ import { Pointer } from "@element-plus/icons-vue"
 import Box from "@pages/components/Box"
 import { CROWDIN_HOMEPAGE } from "@util/constant/url"
 import { ElAlert, ElButton, ElCard } from "element-plus"
-import { type FunctionalComponent } from "vue"
+import { defineComponent } from "vue"
 import ContentContainer from "../common/ContentContainer"
 import MemberList from "./MemberList"
 import ProgressList from "./ProgressList"
 
 const handleJump = () => createTabAfterCurrent(CROWDIN_HOMEPAGE)
 
-const HelpUs: FunctionalComponent = () => (
-    <ContentContainer>
-        <ElCard>
-            <ElAlert type="info" title={t(msg => msg.helpUs.title)}>
-                <li>{t(msg => msg.helpUs.alert.l1)}</li>
-                <li>{t(msg => msg.helpUs.alert.l2)}</li>
-                <li>{t(msg => msg.helpUs.alert.l3)}</li>
-                <li>{t(msg => msg.helpUs.alert.l4)}</li>
-            </ElAlert>
-            <Box marginBlock={30}>
-                <ElButton type="primary" size="large" icon={Pointer} onClick={handleJump}>
-                    {t(msg => msg.helpUs.button)}
-                </ElButton>
-            </Box>
-            <ProgressList />
-            <MemberList />
-        </ElCard>
-    </ContentContainer>
-)
+const HelpUs = defineComponent(() => {
+    return () => (
+        <ContentContainer>
+            <ElCard>
+                <ElAlert type="info" title={t(msg => msg.helpUs.title)}>
+                    <li>{t(msg => msg.helpUs.alert.l1)}</li>
+                    <li>{t(msg => msg.helpUs.alert.l2)}</li>
+                    <li>{t(msg => msg.helpUs.alert.l3)}</li>
+                    <li>{t(msg => msg.helpUs.alert.l4)}</li>
+                </ElAlert>
+                <Box marginBlock={30}>
+                    <ElButton type="primary" size="large" icon={Pointer} onClick={handleJump}>
+                        {t(msg => msg.helpUs.button)}
+                    </ElButton>
+                </Box>
+                <ProgressList />
+                <MemberList />
+            </ElCard>
+        </ContentContainer>
+    )
+})
 
 export default HelpUs

src/pages/app/components/RuleMerge/index.tsx

@@ -7,20 +7,22 @@
 
 import Flex from "@pages/components/Flex"
 import { ElCard } from "element-plus"
-import { type FunctionalComponent } from "vue"
+import { defineComponent } from "vue"
 import ContentContainer from "../common/ContentContainer"
 import AlertInfo from "./AlertInfo"
 import ItemList from "./ItemList"
 
-const RuleMerge: FunctionalComponent = () => (
-    <ContentContainer>
-        <ElCard>
-            <Flex column gap={20}>
-                <AlertInfo />
-                <ItemList />
-            </Flex>
-        </ElCard>
-    </ContentContainer>
-)
+const RuleMerge = defineComponent(() => {
+    return () => (
+        <ContentContainer>
+            <ElCard>
+                <Flex column gap={20}>
+                    <AlertInfo />
+                    <ItemList />
+                </Flex>
+            </ElCard>
+        </ContentContainer>
+    )
+})
 
 export default RuleMerge

src/pages/app/components/Whitelist/index.tsx

@@ -8,26 +8,28 @@
 import { t } from "@app/locale"
 import Flex from "@pages/components/Flex"
 import { ElAlert, ElCard } from "element-plus"
-import { type FunctionalComponent } from "vue"
+import { defineComponent } from "vue"
 import ContentContainer from "../common/ContentContainer"
 import WhitePanel from "./WhitePanel"
 
-const Whitelist: FunctionalComponent = () => (
-    <ContentContainer>
-        <ElCard>
-            <Flex gap={20} column>
-                <ElAlert
-                    title={t(msg => msg.whitelist.infoAlertTitle)}
-                    style={{ padding: "15px 25px" }}
-                    closable={false}
-                >
-                    <li>{t(msg => msg.whitelist.infoAlert0)}</li>
-                    <li>{t(msg => msg.whitelist.infoAlert1)}</li>
-                </ElAlert>
-                <WhitePanel />
-            </Flex>
-        </ElCard>
-    </ContentContainer>
-)
+const Whitelist = defineComponent(() => {
+    return () => (
+        <ContentContainer>
+            <ElCard>
+                <Flex gap={20} column>
+                    <ElAlert
+                        title={t(msg => msg.whitelist.infoAlertTitle)}
+                        style={{ padding: "15px 25px" }}
+                        closable={false}
+                    >
+                        <li>{t(msg => msg.whitelist.infoAlert0)}</li>
+                        <li>{t(msg => msg.whitelist.infoAlert1)}</li>
+                    </ElAlert>
+                    <WhitePanel />
+                </Flex>
+            </ElCard>
+        </ContentContainer>
+    )
+})
 
 export default Whitelist