1

nuxt.config.ts

@@ -76,6 +76,8 @@ export default defineNuxtConfig({
       },
       // rollupOptions: {
       //   output: {
+      //     // 最小包体积--实验性的，目前还不稳定
+      //     experimentalMinChunkSize:10000,
       //     manualChunks: {
       //       CustomEcharts: ["echarts"],
       //     },

plugins/Tdesign.ts

 import { defineNuxtPlugin } from "#app";
 import {
   Button as TButton,
-  Content as TContent,
-  Layout as Tlayout,
   Input as TInput,
   Loading as TLoading,
   TabPanel as TTabPanel,
-  Tabs as TTabs,
   Tooltip as TTooltip,
   Select as TSelect,
   Popup as TPopup,
@@ -19,12 +16,9 @@ import {
 } from "tdesign-vue-next";
 const components = [
   TButton,
-  TContent,
-  Tlayout,
   TInput,
   TLoading,
   TTabPanel,
-  TTabs,
   TTooltip,
   TSelect,
   TPopup,

views/layout/Header.vue

@@ -6,7 +6,7 @@
           <HomeLogo v-if="mode !== 'dark'" class="home-logo"></HomeLogo>
           <HomeLogo2 v-else class="home-logo"></HomeLogo2>
         </NuxtLink>
-        <div class="header-operate-left" v-if="true">
+        <div class="header-operate-left">
           <Search v-if="route.meta.hasSearch"></Search>
         </div>
         <a class="join-us" :href="tgUrl" target="_blank">
@@ -29,12 +29,14 @@
 </template>
 
 <script setup lang="ts">
-import LoginDropdown from "./LoginDropdown.vue";
 import Foxwallet from "./Foxwallet.vue";
-import Search from "./Search.vue";
 import HomeLogo from "/public/images/svg/header/homeLogoLight.svg";
 import HomeLogo2 from "/public/images/svg/header/homeLogoDark.svg";
 import { tgUrl } from "@/utils/open";
+import ChangeTheme from "@/views/CustomComponent/changeTheme.vue";
+import { HeadMenu as THeadMenu } from "tdesign-vue-next";
+const Search = defineAsyncComponent(() => import("./Search.vue"));
+const LoginDropdown = defineAsyncComponent(() => import("./LoginDropdown.vue"));
 const mode = useCurTheme();
 const route = useRoute();
 </script>

views/layout/layout.vue

@@ -19,7 +19,11 @@
 <script lang="ts" setup>
 import Header from "./Header.vue";
 import Footer from "./Footer.vue";
-import { Header as THeader } from "tdesign-vue-next";
+import {
+  Header as THeader,
+  Content as TContent,
+  Layout as TLayout,
+} from "tdesign-vue-next";
 const route = useRoute();
 </script>
 

views/login/index.vue

@@ -10,7 +10,7 @@
             <span v-else @click="goHome">
               <leftLogoDarkSvg></leftLogoDarkSvg>
             </span>
-            <div class="home" @click="goHome">{{ $t('login.goHome') }}</div>
+            <div class="home" @click="goHome">{{ $t("login.goHome") }}</div>
           </div>
           <div class="login-block">
             <register
@@ -28,7 +28,7 @@
             <ChangeTheme></ChangeTheme>
           </div>
           <div class="right-box">
-            <p>{{ $t('login.h2') }}</p>
+            <p>{{ $t("login.h2") }}</p>
             <span v-if="mode === 'light'">
               <rightLogoLightSvg></rightLogoLightSvg>
             </span>
@@ -42,26 +42,27 @@
   </div>
 </template>
 <script setup lang="ts">
-import Login from '@/views/login/Login.vue';
-import Register from '@/views/login/Register.vue';
-import ResetPassword from '@/views/login/ResetPassword.vue';
-import leftLogoLightSvg from '/public/images/svg/login/homeLogo.svg';
-import leftLogoDarkSvg from '/public/images/svg/login/leftdarkLogo.svg';
-import rightLogoLightSvg from '/public/images/svg/login/favicon-light.svg';
-import rightLogoDarkSvg from '/public/images/svg/login/rightdarkLogo.svg';
-import { webLogo } from '@/constants/logo';
+import Login from "@/views/login/Login.vue";
+import Register from "@/views/login/Register.vue";
+import ResetPassword from "@/views/login/ResetPassword.vue";
+import leftLogoLightSvg from "/public/images/svg/login/homeLogo.svg";
+import leftLogoDarkSvg from "/public/images/svg/login/leftdarkLogo.svg";
+import rightLogoLightSvg from "/public/images/svg/login/favicon-light.svg";
+import rightLogoDarkSvg from "/public/images/svg/login/rightdarkLogo.svg";
+import { webLogo } from "@/constants/logo";
+import ChangeTheme from "@/views/CustomComponent/changeTheme.vue";
 useHead({
-  title: 'Dexfilter | Login',
+  title: "Dexfilter | Login",
   link: [webLogo],
 });
 const route = useRoute();
 // 当前主题
 const mode = useCurTheme();
-const InvitCode = route.params.code + '';
+const InvitCode = route.params.code + "";
 // 如果链接中带了邀请码,切换到注册页面
 onMounted(() => {
   if (InvitCode) {
-    type.value = 'register';
+    type.value = "register";
   }
 });
 const type = ref(route.query.type);
@@ -72,13 +73,13 @@ const goBtn = (val: string) => {
 
 const goHome = () => {
   router.push({
-    path: '/',
+    path: "/",
   });
 };
 </script>
 <style lang="less" scoped>
-@import '@/style/variables.less';
-@import '@/style/flex.less';
+@import "@/style/variables.less";
+@import "@/style/flex.less";
 .login-wrapper {
   background-color: var(--td-bg-color-page);
   display: flex;

views/token/RightDetail.vue

@@ -117,7 +117,7 @@ import TokenInfo from "./TokenInfo.vue";
 import TokenPool from "./TokenPool.vue";
 import TokenSocialList from "./TokenSocialList.vue";
 import * as Cache from "@/utils/cache";
-import { MessagePlugin } from "tdesign-vue-next";
+import { MessagePlugin, Tabs as TTabs } from "tdesign-vue-next";
 import Detailsicon from "/public/images/svg/rightDetail/detailsicon.svg";
 import Favo from "/public/images/svg/rightDetail/favo.svg";
 import CollectionSvg from "/public/images/svg/rightDetail/colection.svg";

views/user/index.vue

@@ -10,9 +10,9 @@
               </div>
               <div class="userinfo-vip">
                 <span style="font-size: 20px">
-                  {{ userInfo.name ?? '---' }}
+                  {{ userInfo.name ?? "---" }}
                 </span>
-                <p>{{ userInfo.vip_type ?? '免费会员' }}</p>
+                <p>{{ userInfo.vip_type ?? "免费会员" }}</p>
               </div>
             </div>
             <div style="display: none">
@@ -40,32 +40,33 @@
 </template>
 
 <script lang="tsx" setup>
-import MyLayout from '@/views/layout/layout.vue';
-import PersonalCenter from '@/views/user/PersonalCenter.vue';
-import MemberCenter from '@/views/user/memberCenter.vue';
-import Invitation from '@/views/user/invitation.vue';
-import Billing from '@/views/user/Billing.vue';
-import Logout from '@/views/user/logout.vue';
-import userTwoSvg from '/public/images/svg/header/userTwo.svg';
-import vipSvg from '/public/images/svg/header/vip.svg';
-import collectSvg from '/public/images/svg/header/collect.svg';
-import BillSvg from '/public/images/svg/header/Bill.svg';
-import logoutSvg from '/public/images/svg/header/logout.svg';
-import request from '@/utils/request';
-import { useI18n } from 'vue-i18n';
-import { webLogo } from '@/constants/logo';
+import MyLayout from "@/views/layout/layout.vue";
+import PersonalCenter from "@/views/user/PersonalCenter.vue";
+import MemberCenter from "@/views/user/memberCenter.vue";
+import Invitation from "@/views/user/invitation.vue";
+import Billing from "@/views/user/Billing.vue";
+import Logout from "@/views/user/logout.vue";
+import userTwoSvg from "/public/images/svg/header/userTwo.svg";
+import vipSvg from "/public/images/svg/header/vip.svg";
+import collectSvg from "/public/images/svg/header/collect.svg";
+import BillSvg from "/public/images/svg/header/Bill.svg";
+import logoutSvg from "/public/images/svg/header/logout.svg";
+import request from "@/utils/request";
+import { useI18n } from "vue-i18n";
+import { webLogo } from "@/constants/logo";
+import { Tabs as TTabs } from "tdesign-vue-next";
 useHead({
-  title: 'Dexfilter | User',
+  title: "Dexfilter | User",
   meta: [
     {
-      name: 'description',
-      content: 'Dexfilter-用户中心，可管理自己的账户',
+      name: "description",
+      content: "Dexfilter-用户中心，可管理自己的账户",
     },
   ],
   link: [webLogo],
 });
 const route = useRoute();
-const Cookie = useCookie('userCookie');
+const Cookie = useCookie("userCookie");
 const router = useRouter();
 const { t } = useI18n();
 const tableValue = ref(route.name);
@@ -86,55 +87,55 @@ const tabList = [
     label: () => (
       <div class="tab-label">
         <userTwoSvg />
-        <p>{t('user.IndividualCenter')}</p>
+        <p>{t("user.IndividualCenter")}</p>
       </div>
     ),
-    value: 'personal',
+    value: "personal",
     panel: () => <PersonalCenter></PersonalCenter>,
   },
   {
     label: () => (
       <div class="tab-label">
         <vipSvg />
-        <p>{t('user.MemberCenter')}</p>
+        <p>{t("user.MemberCenter")}</p>
       </div>
     ),
-    value: 'member',
+    value: "member",
     panel: () => <MemberCenter></MemberCenter>,
   },
   {
     label: () => (
       <div class="tab-label">
         <collectSvg />
-        <p>{t('user.InvitationCenter')}</p>
+        <p>{t("user.InvitationCenter")}</p>
       </div>
     ),
-    value: 'InviteWelfare',
+    value: "InviteWelfare",
     panel: () => <Invitation></Invitation>,
   },
   {
     label: () => (
       <div class="tab-label">
         <BillSvg />
-        <p>{t('user.BillingDetails')}</p>
+        <p>{t("user.BillingDetails")}</p>
       </div>
     ),
-    value: 'Billing',
+    value: "Billing",
     panel: () => <Billing></Billing>,
   },
   {
     label: () => (
       <div class="tab-label">
         <logoutSvg />
-        <p>{t('user.Logout')}</p>
+        <p>{t("user.Logout")}</p>
       </div>
     ),
-    value: 'logout',
+    value: "logout",
     panel: () => <Logout></Logout>,
   },
 ];
 const tabchange = (value: string) => {
-  if (value === 'logout') {
+  if (value === "logout") {
     return;
   }
   tableValue.value = value;
@@ -154,7 +155,7 @@ onMounted(() => {
   getUserInfo();
 });
 const getUserInfo = async () => {
-  const result: any = await request.get('/api/user/info', {
+  const result: any = await request.get("/api/user/info", {
     headers: {
       authorization: `Bearer ${Cookie.value}`,
     },
@@ -167,8 +168,8 @@ const getUserInfo = async () => {
 </script>
 
 <style lang="less" scoped>
-@import '@/style/variables.less';
-@import '@/style/flex.less';
+@import "@/style/variables.less";
+@import "@/style/flex.less";
 .user-info-box {
   background: @td--right-back-color-2;
   box-sizing: border-box;