diff --git a/babel.config.js b/babel.config.js
index b93e03333..b54951348 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -3,7 +3,7 @@ const plugins = [
   ['@babel/plugin-proposal-decorators', { legacy: true }],
   ['@babel/plugin-transform-runtime'],
   ['@babel/plugin-transform-modules-commonjs'],
-  ['@babel/plugin-proposal-object-rest-spread', { loose: true, useBuiltIns: true }],
+  ['@babel/plugin-proposal-object-rest-spread', { loose: true, useBuiltIns: true }]
 ]
 
 module.exports = {
@@ -12,20 +12,20 @@ module.exports = {
       '@babel/preset-env',
       {
         targets: {
-          browsers: ['> 1%', 'last 2 versions', 'not ie <= 8'],
+          browsers: ['> 1%', 'last 2 versions', 'not ie <= 8']
         },
         modules: false,
         useBuiltIns: 'entry',
-        corejs: 3,
-      },
+        corejs: 3
+      }
     ],
     [
       '@babel/preset-react',
       {
-        runtime: 'automatic',
-      },
+        runtime: 'automatic'
+      }
     ],
-    '@babel/preset-typescript',
+    '@babel/preset-typescript'
   ],
   compact: true,
   comments: true,
@@ -35,7 +35,7 @@ module.exports = {
       : plugins,
   env: {
     development: {
-      plugins: ['react-refresh/babel'],
-    },
-  },
+      plugins: ['react-refresh/babel']
+    }
+  }
 }
diff --git a/src/components/container/masonryContainer/index.jsx b/src/components/container/masonryContainer/index.jsx
index 24932894a..43bac9b2b 100644
--- a/src/components/container/masonryContainer/index.jsx
+++ b/src/components/container/masonryContainer/index.jsx
@@ -4,25 +4,25 @@ const MyMasonry = () => {
   const masonryContainer = useMasonry()
   return (
     <div
-      className="mx-auto grid max-w-sm items-start gap-6 sm:max-w-none sm:grid-cols-2 lg:grid-cols-3"
+      className='mx-auto grid max-w-sm items-start gap-6 sm:max-w-none sm:grid-cols-2 lg:grid-cols-3'
       ref={masonryContainer}
     >
-      <div className="relative rounded-xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 140 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 80 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 150 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 120 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 130 }}>我的中国心</div>
       </div>
-      <div className="relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]">
+      <div className='relative rounded-2xl bg-linear-to-br from-gray-900/50 via-gray-800/25 to-gray-900/50 p-5 backdrop-blur-xs transition-opacity before:pointer-events-none before:absolute before:inset-0 before:rounded-[inherit] before:border before:border-transparent before:[mask-composite:exclude_!important] before:[background:linear-gradient(to_right,var(--color-gray-800),var(--color-gray-700),var(--color-gray-800))_border-box] before:[mask:linear-gradient(white_0_0)_padding-box,_linear-gradient(white_0_0)]'>
         <div style={{ height: 50 }}>我的中国心</div>
       </div>
     </div>
diff --git a/src/components/stateless/BackgroundBeams/index.jsx b/src/components/stateless/BackgroundBeams/index.jsx
index 57e1ba68a..774ecb366 100644
--- a/src/components/stateless/BackgroundBeams/index.jsx
+++ b/src/components/stateless/BackgroundBeams/index.jsx
@@ -53,7 +53,7 @@ const BackgroundBeams = React.memo(({ className }) => {
     'M-58 -557C-58 -557 10 -152 474 -25C938 102 1006 507 1006 507',
     'M-51 -565C-51 -565 17 -160 481 -33C945 94 1013 499 1013 499',
     'M-44 -573C-44 -573 24 -168 488 -41C952 86 1020 491 1020 491',
-    'M-37 -581C-37 -581 31 -176 495 -49C959 78 1027 483 1027 483',
+    'M-37 -581C-37 -581 31 -176 495 -49C959 78 1027 483 1027 483'
   ]
   return (
     <div
@@ -63,28 +63,28 @@ const BackgroundBeams = React.memo(({ className }) => {
       )}
     >
       <svg
-        className="pointer-events-none absolute z-0 h-full w-full"
-        width="100%"
-        height="100%"
-        viewBox="0 0 696 316"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
+        className='pointer-events-none absolute z-0 h-full w-full'
+        width='100%'
+        height='100%'
+        viewBox='0 0 696 316'
+        fill='none'
+        xmlns='http://www.w3.org/2000/svg'
       >
         <path
-          d="M-380 -189C-380 -189 -312 216 152 343C616 470 684 875 684 875M-373 -197C-373 -197 -305 208 159 335C623 462 691 867 691 867M-366 -205C-366 -205 -298 200 166 327C630 454 698 859 698 859M-359 -213C-359 -213 -291 192 173 319C637 446 705 851 705 851M-352 -221C-352 -221 -284 184 180 311C644 438 712 843 712 843M-345 -229C-345 -229 -277 176 187 303C651 430 719 835 719 835M-338 -237C-338 -237 -270 168 194 295C658 422 726 827 726 827M-331 -245C-331 -245 -263 160 201 287C665 414 733 819 733 819M-324 -253C-324 -253 -256 152 208 279C672 406 740 811 740 811M-317 -261C-317 -261 -249 144 215 271C679 398 747 803 747 803M-310 -269C-310 -269 -242 136 222 263C686 390 754 795 754 795M-303 -277C-303 -277 -235 128 229 255C693 382 761 787 761 787M-296 -285C-296 -285 -228 120 236 247C700 374 768 779 768 779M-289 -293C-289 -293 -221 112 243 239C707 366 775 771 775 771M-282 -301C-282 -301 -214 104 250 231C714 358 782 763 782 763M-275 -309C-275 -309 -207 96 257 223C721 350 789 755 789 755M-268 -317C-268 -317 -200 88 264 215C728 342 796 747 796 747M-261 -325C-261 -325 -193 80 271 207C735 334 803 739 803 739M-254 -333C-254 -333 -186 72 278 199C742 326 810 731 810 731M-247 -341C-247 -341 -179 64 285 191C749 318 817 723 817 723M-240 -349C-240 -349 -172 56 292 183C756 310 824 715 824 715M-233 -357C-233 -357 -165 48 299 175C763 302 831 707 831 707M-226 -365C-226 -365 -158 40 306 167C770 294 838 699 838 699M-219 -373C-219 -373 -151 32 313 159C777 286 845 691 845 691M-212 -381C-212 -381 -144 24 320 151C784 278 852 683 852 683M-205 -389C-205 -389 -137 16 327 143C791 270 859 675 859 675M-198 -397C-198 -397 -130 8 334 135C798 262 866 667 866 667M-191 -405C-191 -405 -123 0 341 127C805 254 873 659 873 659M-184 -413C-184 -413 -116 -8 348 119C812 246 880 651 880 651M-177 -421C-177 -421 -109 -16 355 111C819 238 887 643 887 643M-170 -429C-170 -429 -102 -24 362 103C826 230 894 635 894 635M-163 -437C-163 -437 -95 -32 369 95C833 222 901 627 901 627M-156 -445C-156 -445 -88 -40 376 87C840 214 908 619 908 619M-149 -453C-149 -453 -81 -48 383 79C847 206 915 611 915 611M-142 -461C-142 -461 -74 -56 390 71C854 198 922 603 922 603M-135 -469C-135 -469 -67 -64 397 63C861 190 929 595 929 595M-128 -477C-128 -477 -60 -72 404 55C868 182 936 587 936 587M-121 -485C-121 -485 -53 -80 411 47C875 174 943 579 943 579M-114 -493C-114 -493 -46 -88 418 39C882 166 950 571 950 571M-107 -501C-107 -501 -39 -96 425 31C889 158 957 563 957 563M-100 -509C-100 -509 -32 -104 432 23C896 150 964 555 964 555M-93 -517C-93 -517 -25 -112 439 15C903 142 971 547 971 547M-86 -525C-86 -525 -18 -120 446 7C910 134 978 539 978 539M-79 -533C-79 -533 -11 -128 453 -1C917 126 985 531 985 531M-72 -541C-72 -541 -4 -136 460 -9C924 118 992 523 992 523M-65 -549C-65 -549 3 -144 467 -17C931 110 999 515 999 515M-58 -557C-58 -557 10 -152 474 -25C938 102 1006 507 1006 507M-51 -565C-51 -565 17 -160 481 -33C945 94 1013 499 1013 499M-44 -573C-44 -573 24 -168 488 -41C952 86 1020 491 1020 491M-37 -581C-37 -581 31 -176 495 -49C959 78 1027 483 1027 483M-30 -589C-30 -589 38 -184 502 -57C966 70 1034 475 1034 475M-23 -597C-23 -597 45 -192 509 -65C973 62 1041 467 1041 467M-16 -605C-16 -605 52 -200 516 -73C980 54 1048 459 1048 459M-9 -613C-9 -613 59 -208 523 -81C987 46 1055 451 1055 451M-2 -621C-2 -621 66 -216 530 -89C994 38 1062 443 1062 443M5 -629C5 -629 73 -224 537 -97C1001 30 1069 435 1069 435M12 -637C12 -637 80 -232 544 -105C1008 22 1076 427 1076 427M19 -645C19 -645 87 -240 551 -113C1015 14 1083 419 1083 419"
-          stroke="url(#paint0_radial_242_278)"
-          strokeOpacity="0.05"
-          strokeWidth="0.5"
-        ></path>
+          d='M-380 -189C-380 -189 -312 216 152 343C616 470 684 875 684 875M-373 -197C-373 -197 -305 208 159 335C623 462 691 867 691 867M-366 -205C-366 -205 -298 200 166 327C630 454 698 859 698 859M-359 -213C-359 -213 -291 192 173 319C637 446 705 851 705 851M-352 -221C-352 -221 -284 184 180 311C644 438 712 843 712 843M-345 -229C-345 -229 -277 176 187 303C651 430 719 835 719 835M-338 -237C-338 -237 -270 168 194 295C658 422 726 827 726 827M-331 -245C-331 -245 -263 160 201 287C665 414 733 819 733 819M-324 -253C-324 -253 -256 152 208 279C672 406 740 811 740 811M-317 -261C-317 -261 -249 144 215 271C679 398 747 803 747 803M-310 -269C-310 -269 -242 136 222 263C686 390 754 795 754 795M-303 -277C-303 -277 -235 128 229 255C693 382 761 787 761 787M-296 -285C-296 -285 -228 120 236 247C700 374 768 779 768 779M-289 -293C-289 -293 -221 112 243 239C707 366 775 771 775 771M-282 -301C-282 -301 -214 104 250 231C714 358 782 763 782 763M-275 -309C-275 -309 -207 96 257 223C721 350 789 755 789 755M-268 -317C-268 -317 -200 88 264 215C728 342 796 747 796 747M-261 -325C-261 -325 -193 80 271 207C735 334 803 739 803 739M-254 -333C-254 -333 -186 72 278 199C742 326 810 731 810 731M-247 -341C-247 -341 -179 64 285 191C749 318 817 723 817 723M-240 -349C-240 -349 -172 56 292 183C756 310 824 715 824 715M-233 -357C-233 -357 -165 48 299 175C763 302 831 707 831 707M-226 -365C-226 -365 -158 40 306 167C770 294 838 699 838 699M-219 -373C-219 -373 -151 32 313 159C777 286 845 691 845 691M-212 -381C-212 -381 -144 24 320 151C784 278 852 683 852 683M-205 -389C-205 -389 -137 16 327 143C791 270 859 675 859 675M-198 -397C-198 -397 -130 8 334 135C798 262 866 667 866 667M-191 -405C-191 -405 -123 0 341 127C805 254 873 659 873 659M-184 -413C-184 -413 -116 -8 348 119C812 246 880 651 880 651M-177 -421C-177 -421 -109 -16 355 111C819 238 887 643 887 643M-170 -429C-170 -429 -102 -24 362 103C826 230 894 635 894 635M-163 -437C-163 -437 -95 -32 369 95C833 222 901 627 901 627M-156 -445C-156 -445 -88 -40 376 87C840 214 908 619 908 619M-149 -453C-149 -453 -81 -48 383 79C847 206 915 611 915 611M-142 -461C-142 -461 -74 -56 390 71C854 198 922 603 922 603M-135 -469C-135 -469 -67 -64 397 63C861 190 929 595 929 595M-128 -477C-128 -477 -60 -72 404 55C868 182 936 587 936 587M-121 -485C-121 -485 -53 -80 411 47C875 174 943 579 943 579M-114 -493C-114 -493 -46 -88 418 39C882 166 950 571 950 571M-107 -501C-107 -501 -39 -96 425 31C889 158 957 563 957 563M-100 -509C-100 -509 -32 -104 432 23C896 150 964 555 964 555M-93 -517C-93 -517 -25 -112 439 15C903 142 971 547 971 547M-86 -525C-86 -525 -18 -120 446 7C910 134 978 539 978 539M-79 -533C-79 -533 -11 -128 453 -1C917 126 985 531 985 531M-72 -541C-72 -541 -4 -136 460 -9C924 118 992 523 992 523M-65 -549C-65 -549 3 -144 467 -17C931 110 999 515 999 515M-58 -557C-58 -557 10 -152 474 -25C938 102 1006 507 1006 507M-51 -565C-51 -565 17 -160 481 -33C945 94 1013 499 1013 499M-44 -573C-44 -573 24 -168 488 -41C952 86 1020 491 1020 491M-37 -581C-37 -581 31 -176 495 -49C959 78 1027 483 1027 483M-30 -589C-30 -589 38 -184 502 -57C966 70 1034 475 1034 475M-23 -597C-23 -597 45 -192 509 -65C973 62 1041 467 1041 467M-16 -605C-16 -605 52 -200 516 -73C980 54 1048 459 1048 459M-9 -613C-9 -613 59 -208 523 -81C987 46 1055 451 1055 451M-2 -621C-2 -621 66 -216 530 -89C994 38 1062 443 1062 443M5 -629C5 -629 73 -224 537 -97C1001 30 1069 435 1069 435M12 -637C12 -637 80 -232 544 -105C1008 22 1076 427 1076 427M19 -645C19 -645 87 -240 551 -113C1015 14 1083 419 1083 419'
+          stroke='url(#paint0_radial_242_278)'
+          strokeOpacity='0.05'
+          strokeWidth='0.5'
+        />
 
         {paths.map((path, index) => (
           <motion.path
-            key={`path-` + index}
+            key={'path-' + index}
             d={path}
             stroke={`url(#linearGradient-${index})`}
-            strokeOpacity="0.4"
-            strokeWidth="0.6"
-          ></motion.path>
+            strokeOpacity='0.4'
+            strokeWidth='0.6'
+          />
         ))}
         <defs>
           {paths.map((path, index) => (
@@ -95,39 +95,39 @@ const BackgroundBeams = React.memo(({ className }) => {
                 x1: '0%',
                 x2: '0%',
                 y1: '0%',
-                y2: '0%',
+                y2: '0%'
               }}
               animate={{
                 x1: ['0%', '100%'],
                 x2: ['0%', '95%'],
                 y1: ['0%', '100%'],
-                y2: ['0%', `${93 + Math.random() * 8}%`],
+                y2: ['0%', `${93 + Math.random() * 8}%`]
               }}
               transition={{
                 duration: Math.random() * 10 + 10,
                 ease: 'easeInOut',
                 repeat: Infinity,
-                delay: Math.random() * 10,
+                delay: Math.random() * 10
               }}
             >
-              <stop stopColor="#18CCFC" stopOpacity="0"></stop>
-              <stop stopColor="#18CCFC"></stop>
-              <stop offset="32.5%" stopColor="#6344F5"></stop>
-              <stop offset="100%" stopColor="#AE48FF" stopOpacity="0"></stop>
+              <stop stopColor='#18CCFC' stopOpacity='0' />
+              <stop stopColor='#18CCFC' />
+              <stop offset='32.5%' stopColor='#6344F5' />
+              <stop offset='100%' stopColor='#AE48FF' stopOpacity='0' />
             </motion.linearGradient>
           ))}
 
           <radialGradient
-            id="paint0_radial_242_278"
-            cx="0"
-            cy="0"
-            r="1"
-            gradientUnits="userSpaceOnUse"
-            gradientTransform="translate(352 34) rotate(90) scale(555 1560.62)"
+            id='paint0_radial_242_278'
+            cx='0'
+            cy='0'
+            r='1'
+            gradientUnits='userSpaceOnUse'
+            gradientTransform='translate(352 34) rotate(90) scale(555 1560.62)'
           >
-            <stop offset="0.0666667" stopColor="var(--neutral-300)"></stop>
-            <stop offset="0.243243" stopColor="var(--neutral-300)"></stop>
-            <stop offset="0.43594" stopColor="white" stopOpacity="0"></stop>
+            <stop offset='0.0666667' stopColor='var(--neutral-300)' />
+            <stop offset='0.243243' stopColor='var(--neutral-300)' />
+            <stop offset='0.43594' stopColor='white' stopOpacity='0' />
           </radialGradient>
         </defs>
       </svg>
diff --git a/src/components/stateless/BorderBeam/index.jsx b/src/components/stateless/BorderBeam/index.jsx
index 0264bdf1a..7831f177d 100644
--- a/src/components/stateless/BorderBeam/index.jsx
+++ b/src/components/stateless/BorderBeam/index.jsx
@@ -12,10 +12,10 @@ const BorderBeam = ({
   transition,
   style,
   reverse = false,
-  initialOffset = 0,
+  initialOffset = 0
 }) => {
   return (
-    <div className="pointer-events-none absolute inset-0 rounded-[inherit] border border-transparent [mask-image:linear-gradient(transparent,transparent),linear-gradient(#000,#000)] [mask-composite:intersect] [mask-clip:padding-box,border-box]">
+    <div className='pointer-events-none absolute inset-0 rounded-[inherit] border border-transparent [mask-image:linear-gradient(transparent,transparent),linear-gradient(#000,#000)] [mask-composite:intersect] [mask-clip:padding-box,border-box]'>
       <motion.div
         className={clsx(
           'absolute aspect-square',
@@ -27,20 +27,20 @@ const BorderBeam = ({
           offsetPath: `rect(0 auto auto 0 round ${size}px)`,
           '--color-from': colorFrom,
           '--color-to': colorTo,
-          ...style,
+          ...style
         }}
         initial={{ offsetDistance: `${initialOffset}%` }}
         animate={{
           offsetDistance: reverse
             ? [`${100 - initialOffset}%`, `${-initialOffset}%`]
-            : [`${initialOffset}%`, `${100 + initialOffset}%`],
+            : [`${initialOffset}%`, `${100 + initialOffset}%`]
         }}
         transition={{
           repeat: Infinity,
           ease: 'linear',
           duration,
           delay: -delay,
-          ...transition,
+          ...transition
         }}
       />
     </div>
diff --git a/src/components/stateless/CompareAll/index.jsx b/src/components/stateless/CompareAll/index.jsx
index b711850ca..97b8f5b70 100644
--- a/src/components/stateless/CompareAll/index.jsx
+++ b/src/components/stateless/CompareAll/index.jsx
@@ -14,7 +14,7 @@ const Compare = ({
   slideMode = 'hover',
   showHandlebar = true,
   autoplay = false,
-  autoplayDuration = 5000,
+  autoplayDuration = 5000
 }) => {
   const [sliderXPercent, setSliderXPercent] = useState(initialSliderPercentage)
   const [isDragging, setIsDragging] = useState(false)
@@ -53,12 +53,12 @@ const Compare = ({
     return () => stopAutoplay()
   }, [startAutoplay, stopAutoplay])
 
-  function mouseEnterHandler() {
+  function mouseEnterHandler () {
     setIsMouseOver(true)
     stopAutoplay()
   }
 
-  function mouseLeaveHandler() {
+  function mouseLeaveHandler () {
     setIsMouseOver(false)
     if (slideMode === 'hover') {
       setSliderXPercent(initialSliderPercentage)
@@ -133,7 +133,7 @@ const Compare = ({
       className={clsx('h-[160px] w-[360px] overflow-hidden', className)}
       style={{
         position: 'relative',
-        cursor: slideMode === 'drag' ? 'grab' : 'col-resize',
+        cursor: slideMode === 'drag' ? 'grab' : 'col-resize'
       }}
       onMouseMove={handleMouseMove}
       onMouseLeave={mouseLeaveHandler}
@@ -146,57 +146,61 @@ const Compare = ({
     >
       <AnimatePresence initial={false}>
         <motion.div
-          className="absolute top-0 z-30 m-auto h-full w-px bg-linear-to-b from-transparent from-5% via-indigo-500 to-transparent to-95%"
+          className='absolute top-0 z-30 m-auto h-full w-px bg-linear-to-b from-transparent from-5% via-indigo-500 to-transparent to-95%'
           style={{
             left: `${sliderXPercent}%`,
             top: '0',
-            zIndex: 40,
+            zIndex: 40
           }}
           transition={{ duration: 0 }}
         >
-          <div className="absolute top-1/2 left-0 z-20 h-full w-36 -translate-y-1/2 bg-linear-to-r from-indigo-400 via-transparent to-transparent [mask-image:radial-gradient(100px_at_left,white,transparent)] opacity-50" />
-          <div className="absolute top-1/2 left-0 z-10 h-1/2 w-10 -translate-y-1/2 bg-linear-to-r from-cyan-400 via-transparent to-transparent [mask-image:radial-gradient(50px_at_left,white,transparent)] opacity-100" />
-          <div className="absolute top-1/2 -right-10 h-3/4 w-10 -translate-y-1/2 [mask-image:radial-gradient(100px_at_left,white,transparent)]"></div>
+          <div className='absolute top-1/2 left-0 z-20 h-full w-36 -translate-y-1/2 bg-linear-to-r from-indigo-400 via-transparent to-transparent [mask-image:radial-gradient(100px_at_left,white,transparent)] opacity-50' />
+          <div className='absolute top-1/2 left-0 z-10 h-1/2 w-10 -translate-y-1/2 bg-linear-to-r from-cyan-400 via-transparent to-transparent [mask-image:radial-gradient(50px_at_left,white,transparent)] opacity-100' />
+          <div className='absolute top-1/2 -right-10 h-3/4 w-10 -translate-y-1/2 [mask-image:radial-gradient(100px_at_left,white,transparent)]' />
           {showHandlebar && (
-            <div className="absolute top-1/2 -right-2.5 z-30 flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-md bg-white shadow-[0px_-1px_0px_0px_#FFFFFF40]">
-              <GitMerge className="h-4 w-4 text-black" />
+            <div className='absolute top-1/2 -right-2.5 z-30 flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-md bg-white shadow-[0px_-1px_0px_0px_#FFFFFF40]'>
+              <GitMerge className='h-4 w-4 text-black' />
             </div>
           )}
         </motion.div>
       </AnimatePresence>
-      <div className="pointer-events-none relative z-20 h-full w-full overflow-hidden">
+      <div className='pointer-events-none relative z-20 h-full w-full overflow-hidden'>
         <AnimatePresence initial={false}>
-          {firstImage ? (
-            <motion.div
-              className={clsx(
-                'absolute inset-0 z-20 h-full w-full shrink-0 overflow-hidden select-none',
-                firstImageClassName
-              )}
-              style={{
-                clipPath: `inset(0 ${100 - sliderXPercent}% 0 0)`,
-              }}
-              transition={{ duration: 0 }}
-            >
-              <img
-                alt="first image"
-                src={firstImage}
-                className={clsx('absolute inset-0 z-20 h-full w-full shrink-0 select-none', firstImageClassName)}
-                draggable={false}
-              />
-            </motion.div>
-          ) : null}
+          {firstImage
+            ? (
+              <motion.div
+                className={clsx(
+                  'absolute inset-0 z-20 h-full w-full shrink-0 overflow-hidden select-none',
+                  firstImageClassName
+                )}
+                style={{
+                  clipPath: `inset(0 ${100 - sliderXPercent}% 0 0)`
+                }}
+                transition={{ duration: 0 }}
+              >
+                <img
+                  alt='first image'
+                  src={firstImage}
+                  className={clsx('absolute inset-0 z-20 h-full w-full shrink-0 select-none', firstImageClassName)}
+                  draggable={false}
+                />
+              </motion.div>
+              )
+            : null}
         </AnimatePresence>
       </div>
 
       <AnimatePresence initial={false}>
-        {secondImage ? (
-          <motion.img
-            className={clsx('absolute top-0 left-0 z-19 h-full w-full select-none', secondImageClassname)}
-            alt="second image"
-            src={secondImage}
-            draggable={false}
-          />
-        ) : null}
+        {secondImage
+          ? (
+            <motion.img
+              className={clsx('absolute top-0 left-0 z-19 h-full w-full select-none', secondImageClassname)}
+              alt='second image'
+              src={secondImage}
+              draggable={false}
+            />
+            )
+          : null}
       </AnimatePresence>
     </div>
   )
diff --git a/src/components/stateless/FixCarouse/index.jsx b/src/components/stateless/FixCarouse/index.jsx
index 99112cdaa..72d8a6b89 100644
--- a/src/components/stateless/FixCarouse/index.jsx
+++ b/src/components/stateless/FixCarouse/index.jsx
@@ -4,7 +4,7 @@ import { ChevronRight, ChevronLeft } from 'lucide-react'
 
 const mockData = Array.from({ length: 30 }, (_, i) => ({
   name: `Item ${i + 1}`,
-  category: ['A', 'B', 'C'][i % 3],
+  category: ['A', 'B', 'C'][i % 3]
 }))
 
 const FixCarousel = ({ tradeList = [] }) => {
@@ -16,7 +16,7 @@ const FixCarousel = ({ tradeList = [] }) => {
     { label: '全部', value: 'all' },
     { label: '分类 A', value: 'A' },
     { label: '分类 B', value: 'B' },
-    { label: '分类 C', value: 'C' },
+    { label: '分类 C', value: 'C' }
   ]
 
   const filterData = () => {
@@ -53,55 +53,57 @@ const FixCarousel = ({ tradeList = [] }) => {
   }, [selectedFilter, data])
 
   return (
-    <div className="relative mx-auto w-full max-w-6xl">
-      <div className="mb-4 flex justify-end">
+    <div className='relative mx-auto w-full max-w-6xl'>
+      <div className='mb-4 flex justify-end'>
         <Select
           value={selectedFilter}
           onChange={setSelectedFilter}
-          className="w-[240px]"
-          placeholder="请选择分类"
+          className='w-[240px]'
+          placeholder='请选择分类'
           options={filters}
         />
       </div>
-      <div className="relative flex items-center justify-between">
-        <Button className="cursor-pointer rounded-full" onClick={prevPage} disabled={currentPage === 0} shape="circle">
+      <div className='relative flex items-center justify-between'>
+        <Button className='cursor-pointer rounded-full' onClick={prevPage} disabled={currentPage === 0} shape='circle'>
           <ChevronLeft />
         </Button>
-        <div className="relative mx-4 flex-grow overflow-hidden">
+        <div className='relative mx-4 flex-grow overflow-hidden'>
           <div
-            className="flex transition-transform duration-300 ease-in-out"
+            className='flex transition-transform duration-300 ease-in-out'
             style={{ transform: `translateX(-${currentPage * 100}%)` }}
           >
-            {paginatedData.length === 0 ? (
-              <div className="w-full text-center text-gray-500">暂无数据</div>
-            ) : (
-              <>
-                {paginatedData.map((page, pageIndex) => (
-                  <div key={pageIndex} className="flex min-w-full flex-wrap justify-center">
-                    {page.map((item, itemIndex) => (
-                      <div key={itemIndex} className="w-1/3 p-2">
-                        <div className="cus-bg mx-auto rounded-md border border-sky-500 p-4 text-center shadow-md">
-                          <div className="mb-2 text-xl text-sky-500">{item.name}</div>
-                          <div className="text-gray-500">{item.category}</div>
+            {paginatedData.length === 0
+              ? (
+                <div className='w-full text-center text-gray-500'>暂无数据</div>
+                )
+              : (
+                <>
+                  {paginatedData.map((page, pageIndex) => (
+                    <div key={pageIndex} className='flex min-w-full flex-wrap justify-center'>
+                      {page.map((item, itemIndex) => (
+                        <div key={itemIndex} className='w-1/3 p-2'>
+                          <div className='cus-bg mx-auto rounded-md border border-sky-500 p-4 text-center shadow-md'>
+                            <div className='mb-2 text-xl text-sky-500'>{item.name}</div>
+                            <div className='text-gray-500'>{item.category}</div>
+                          </div>
                         </div>
-                      </div>
-                    ))}
-                  </div>
-                ))}
-              </>
-            )}
+                      ))}
+                    </div>
+                  ))}
+                </>
+                )}
           </div>
         </div>
         <Button
-          className="cursor-pointer rounded-full"
+          className='cursor-pointer rounded-full'
           onClick={nextPage}
           disabled={currentPage === totalPages - 1 || data.length === 0}
-          shape="circle"
+          shape='circle'
         >
           <ChevronRight />
         </Button>
       </div>
-      <div className="mt-4 flex justify-center gap-4 space-x-4">
+      <div className='mt-4 flex justify-center gap-4 space-x-4'>
         {Array.from({ length: totalPages }).map((_, index) => (
           <button
             key={index}
@@ -109,7 +111,7 @@ const FixCarousel = ({ tradeList = [] }) => {
               currentPage === index ? 'bg-blue-600/80' : 'bg-white'
             }`}
             onClick={() => goToPage(index)}
-          ></button>
+          />
         ))}
       </div>
     </div>
diff --git a/src/pages/home/index.jsx b/src/pages/home/index.jsx
index 225a1e311..aa7cb20b3 100644
--- a/src/pages/home/index.jsx
+++ b/src/pages/home/index.jsx
@@ -79,7 +79,7 @@ import {
   oneApiChat,
   prettyObject,
   // randomNum,
-  getDirection,
+  getDirection
 } from '@utils/aidFn'
 import { fireConfetti } from '@utils/confetti'
 import Zoom from 'react-medium-image-zoom'
@@ -94,7 +94,7 @@ const code = {
 main : "This component needs more than the default code block to be displayed"
 detailed : "For now, if you want the exact same behaviour, please check the github"
 }`,
-  lang: 'typescript',
+  lang: 'typescript'
 }
 
 const preCode = `
@@ -119,26 +119,26 @@ const slugs = [
   'vercel',
   'docker',
   'git',
-  'sonarqube',
+  'sonarqube'
 ]
 
 const dataSteps = [
   {
     title: 'Step 1',
-    code: 'npx create-react-app my-app',
+    code: 'npx create-react-app my-app'
   },
   {
     title: 'Step 2',
-    code: 'cd my-app',
+    code: 'cd my-app'
   },
   {
     title: 'Step 3',
-    code: 'npm start',
+    code: 'npm start'
   },
   {
     title: 'Step 4',
-    code: 'npm run build',
-  },
+    code: 'npm run build'
+  }
 ]
 
 const Home = () => {
@@ -219,8 +219,8 @@ const Home = () => {
       [
         {
           content: text,
-          role: 'user',
-        },
+          role: 'user'
+        }
       ],
       key,
       signal
@@ -298,7 +298,7 @@ const Home = () => {
   const scrollRef = useRef(null)
   const [customElement, setCustomElement] = useState()
   const { scrollDir, scrollPosition } = useDetectScroll({
-    target: customElement,
+    target: customElement
   })
 
   useEffect(() => {
@@ -349,31 +349,31 @@ const Home = () => {
         <TypeWriter
           text={['年轻到足以创新, 成熟到懂得坚持', '你既有冒险的勇气, 又有控制风险的智慧', '人生不设限，梦想不过期! ']}
           speed={70}
-          className="text-gray-500"
+          className='text-gray-500'
           waitTime={1500}
           deleteSpeed={40}
-          cursorChar={'_'}
+          cursorChar='_'
         />
       </section>
       <section style={{ margin: '20px 0', fontSize: 20 }}>
-        <MultiDirectionSlide textLeft="逐光前行，奔赴新程；" textRight="千山过尽，万里星辰！" />
+        <MultiDirectionSlide textLeft='逐光前行，奔赴新程；' textRight='千山过尽，万里星辰！' />
       </section>
       <section style={{ margin: '20px 0', fontSize: 20 }}>
-        <AnimText animText="逐光前行，奔赴新程；千山过尽，万里星辰！" />
+        <AnimText animText='逐光前行，奔赴新程；千山过尽，万里星辰！' />
       </section>
       <section style={{ marginBottom: 15, fontSize: 20, overflow: 'hidden' }}>
         This is something
         <SlideText text={['amazing', 'new', 'wonderful', 'beautiful', 'smart']} />
       </section>
       <section style={{ marginBottom: 15, fontSize: 20 }}>
-        <SparklesText text="千山过尽，万里星辰!" sparklesCount={5} />
+        <SparklesText text='千山过尽，万里星辰!' sparklesCount={5} />
       </section>
 
       <section style={{ marginBottom: 15, fontSize: 20 }}>
-        <AutoLink text="foo bar baz http://example.org bar https://github.com/wkylin/pro-react-admin" />
+        <AutoLink text='foo bar baz http://example.org bar https://github.com/wkylin/pro-react-admin' />
       </section>
       <section style={{ marginBottom: 15, fontSize: 20 }}>
-        <ShinyText text="Just some shiny text!" disabled={false} speed={3} />
+        <ShinyText text='Just some shiny text!' disabled={false} speed={3} />
       </section>
       {/* <section style={{ marginBottom: 15, fontSize: 20 }}>
         <BlurText text="Isn't this so cool?!" delay={50} />
@@ -385,7 +385,7 @@ const Home = () => {
             'Loading awesome content',
             'Almost there',
             'Just a moment',
-            'Getting things ready',
+            'Getting things ready'
           ]}
         />
       </section>
@@ -414,7 +414,7 @@ const Home = () => {
         style={{
           marginBottom: 15,
           position: 'relative',
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <IconCloud images={images} />
@@ -423,7 +423,7 @@ const Home = () => {
         style={{
           marginBottom: 15,
           position: 'relative',
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <NumberViewCard />
@@ -436,12 +436,12 @@ const Home = () => {
           width: 360,
           background: '#111827',
           position: 'relative',
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
-        <Meteors starCount={30} primaryColor="#6366f1" className="opacity-30" />
-        <Meteors starCount={25} primaryColor="#818cf8" className="opacity-50" />
-        <Meteors starCount={20} primaryColor="#ffffff" className="opacity-70" />
+        <Meteors starCount={30} primaryColor='#6366f1' className='opacity-30' />
+        <Meteors starCount={25} primaryColor='#818cf8' className='opacity-50' />
+        <Meteors starCount={20} primaryColor='#ffffff' className='opacity-70' />
       </section>
       <section
         style={{
@@ -449,16 +449,16 @@ const Home = () => {
           fontSize: 20,
           height: 200,
           width: 360,
-          background: '#111827',
+          background: '#111827'
         }}
       >
         <SparklesCore
-          background="transparent"
+          background='transparent'
           minSize={0.4}
           maxSize={1}
           particleDensity={1200}
-          className="h-full w-full"
-          particleColor="#FFFFFF"
+          className='h-full w-full'
+          particleColor='#FFFFFF'
         />
       </section>
       <section
@@ -468,9 +468,9 @@ const Home = () => {
           height: 200,
           width: 360,
           overflow: 'hidden',
-          position: 'relative',
+          position: 'relative'
         }}
-        className="bg-slate-900"
+        className='bg-slate-900'
       >
         <BackgroundBoxes />
       </section>
@@ -481,9 +481,9 @@ const Home = () => {
           height: 200,
           width: 360,
           overflow: 'hidden',
-          position: 'relative',
+          position: 'relative'
         }}
-        className="bg-slate-900"
+        className='bg-slate-900'
       >
         <MemoizedStars />
       </section>
@@ -498,7 +498,7 @@ const Home = () => {
           display: 'flex',
           alignItems: 'center',
           justifyContent: 'center',
-          color: '#fff',
+          color: '#fff'
         }}
       >
         Direction: {enterDirection}
@@ -507,10 +507,10 @@ const Home = () => {
         <CompareAll
           firstImage={firstImage}
           secondImage={secondImage}
-          firstImageClassName="object-cover object-left-top"
-          secondImageClassName="object-cover object-left-top"
-          className="h-[200px]"
-          slideMode="drag"
+          firstImageClassName='object-cover object-left-top'
+          secondImageClassName='object-cover object-left-top'
+          className='h-[200px]'
+          slideMode='drag'
         />
       </section>
       <section
@@ -518,15 +518,15 @@ const Home = () => {
           margin: '20px 0',
           width: 360,
           height: 200,
-          background: '#000',
+          background: '#000'
         }}
       >
         <SquaresGrid
           speed={0.5}
           squareSize={20}
-          direction="diagonal" // up, down, left, right, diagonal
-          borderColor="#222"
-          hoverFillColor="#222"
+          direction='diagonal' // up, down, left, right, diagonal
+          borderColor='#222'
+          hoverFillColor='#222'
         />
       </section>
       {/* <section
@@ -566,15 +566,15 @@ const Home = () => {
         <AvatarCard avatar="https://picsum.photos/seed/picsum/300/160" text="Hi, I'm a developer." />
       </section> */}
       <section>
-        <IsometricCard text="Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti repellat, consequuntur doloribus voluptate esse iure?" />
+        <IsometricCard text='Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti repellat, consequuntur doloribus voluptate esse iure?' />
       </section>
-      <LineBordered text="A line bordered text." />
+      <LineBordered text='A line bordered text.' />
       <section
         style={{
           display: 'flex',
           alignItems: 'center',
           marginTop: 10,
-          marginBottom: 40,
+          marginBottom: 40
         }}
       >
         <Atom /> <Merge /> <GitMerge /> <GitPullRequestArrow />
@@ -588,14 +588,14 @@ const Home = () => {
       <section style={{ marginBottom: 40, fontSize: 16 }}>
         <h3>React Animate On Scroll.</h3>
         <h3>
-          <AutoLink text="https://motion.dev/ https://gsap.com/ https://www.react-spring.dev/ https://use-gesture.netlify.app/" />
+          <AutoLink text='https://motion.dev/ https://gsap.com/ https://www.react-spring.dev/ https://use-gesture.netlify.app/' />
         </h3>
         <h3 style={{ marginBottom: 40 }}>
-          <AutoLink text="https://www.npmjs.com/package/react-animate-on-scroll https://www.npmjs.com/package/react-scroll https://github.com/wellyshen/react-cool-inview" />
+          <AutoLink text='https://www.npmjs.com/package/react-animate-on-scroll https://www.npmjs.com/package/react-scroll https://github.com/wellyshen/react-cool-inview' />
         </h3>
         <ScrollAnimation>
           {/* <LazyLoadImage src="https://picsum.photos/seed/picsum/300/160" alt="Strawberries" /> */}
-          <LazyLoadImage src={secondImage} alt="Strawberries" />
+          <LazyLoadImage src={secondImage} alt='Strawberries' />
         </ScrollAnimation>
       </section>
       {/* <section style={{ marginBottom: 40, fontSize: 36 }}>
@@ -633,7 +633,7 @@ const Home = () => {
           marginBottom: 40,
           width: 360,
           height: 200,
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <AnimateOnScreen.FadeIn>
@@ -645,15 +645,15 @@ const Home = () => {
           marginBottom: 40,
           width: 360,
           height: 200,
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <AnimateOnScreen.FadeUp>
           <img
             src={SongPng}
-            alt=""
+            alt=''
             style={{
-              maskImage: 'linear-gradient(to top, transparent, black 20%, black 80%, transparent)',
+              maskImage: 'linear-gradient(to top, transparent, black 20%, black 80%, transparent)'
             }}
           />
         </AnimateOnScreen.FadeUp>
@@ -663,12 +663,12 @@ const Home = () => {
           marginBottom: 40,
           width: 360,
           height: 200,
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <AnimateOnScreen.ScaleIn triggerOnce={false}>
           <>
-            <img src={SpringPng} alt="" />
+            <img src={SpringPng} alt='' />
             <section className={styles['blend-me']}>Mix Blend Mode</section>
           </>
         </AnimateOnScreen.ScaleIn>
@@ -678,21 +678,21 @@ const Home = () => {
           marginBottom: 40,
           width: 360,
           height: 200,
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <AnimateOnScreen.DiyAnimation
           from={{ opacity: 0, transform: 'translate(-100%, 0)' }}
           to={{ opacity: 1, transform: 'translate(0, 0)' }}
-          triggerOnce={true}
+          triggerOnce
         >
           <Zoom>
-            <img src={HePng} alt="" />
+            <img src={HePng} alt='' />
           </Zoom>
         </AnimateOnScreen.DiyAnimation>
       </section>
       <section style={{ marginBottom: 40, display: 'flex' }}>
-        <SpotlightCard className="my-spot" style={{ width: 360, height: 200, color: '#fff' }}>
+        <SpotlightCard className='my-spot' style={{ width: 360, height: 200, color: '#fff' }}>
           <section />
         </SpotlightCard>
       </section>
@@ -702,7 +702,7 @@ const Home = () => {
         </BlurFade>
       </section>
       <section style={{ margin: '20px 0', fontSize: 24 }}>
-        <GradualSpacing text="2025 年，是充满希望的一年。让我们放下过去的包袱，轻装上阵。用积极的心态去面对生活，用坚定的信念去追逐梦想。相信自己，只要我们努力奋斗，就一定能创造出属于自己的精彩人生。让我们一起逐光前行，奔赴新程，书写属于我们的辉煌篇章！" />
+        <GradualSpacing text='2025 年，是充满希望的一年。让我们放下过去的包袱，轻装上阵。用积极的心态去面对生活，用坚定的信念去追逐梦想。相信自己，只要我们努力奋斗，就一定能创造出属于自己的精彩人生。让我们一起逐光前行，奔赴新程，书写属于我们的辉煌篇章！' />
       </section>
 
       <section style={{ margin: '20px 0' }}>
@@ -716,7 +716,7 @@ const Home = () => {
           height: 200,
           position: 'relative',
           backgroundColor: 'rgba(0, 0,0, 0.8)',
-          borderRadius: 8,
+          borderRadius: 8
         }}
       >
         <section className={styles.dotMask} ref={barRef}>
@@ -735,23 +735,23 @@ const Home = () => {
           marginBottom: 40,
           height: 200,
           width: 360,
-          overflow: 'hidden',
+          overflow: 'hidden'
         }}
       >
         <MeshGradientBackground />
       </section>
       <section
         style={{
-          marginBottom: 20,
+          marginBottom: 20
         }}
       >
         <ScratchToReveal
           width={360}
           height={200}
           minScratchPercentage={70}
-          className="flex items-center justify-center overflow-hidden rounded-2xl border-2 bg-gray-100"
+          className='flex items-center justify-center overflow-hidden rounded-2xl border-2 bg-gray-100'
         >
-          <p className="text-9xl">✨</p>
+          <p className='text-9xl'>✨</p>
         </ScratchToReveal>
       </section>
       <section style={{ margin: 20 }}>
@@ -781,20 +781,20 @@ const Home = () => {
       <section style={{ margin: 20 }} className={styles.eHElAY}>
         Hi, React!
       </section>
-      <section style={{ margin: 20 }} className="z-30 flex w-full items-center justify-start gap-8">
+      <section style={{ margin: 20 }} className='z-30 flex w-full items-center justify-start gap-8'>
         <SlideButton
-          backgroundColor="#0c002b"
-          textColor="#1670f0"
-          borderStartColor="rgba(22, 112, 240, 0.1)"
-          borderEndColor="rgba(22, 112, 240, 0.7)"
+          backgroundColor='#0c002b'
+          textColor='#1670f0'
+          borderStartColor='rgba(22, 112, 240, 0.1)'
+          borderEndColor='rgba(22, 112, 240, 0.7)'
         >
           Button
         </SlideButton>
         <SlideButton
-          backgroundColor="#1a0b2e"
-          textColor="#ff00ff"
-          borderStartColor="rgba(255, 0, 255, 0.1)"
-          borderEndColor="rgba(0, 255, 255, 0.7)"
+          backgroundColor='#1a0b2e'
+          textColor='#ff00ff'
+          borderStartColor='rgba(255, 0, 255, 0.1)'
+          borderEndColor='rgba(0, 255, 255, 0.7)'
         >
           Button
         </SlideButton>
@@ -816,12 +816,12 @@ const Home = () => {
         <NumberFlowFix />
       </section>
       <section style={{ width: 600, margin: '30px 0' }}>
-        <Input defaultValue={apiKey} placeholder="api key" onChange={changeApiKey} style={{ marginBottom: 20 }} />
-        <Flex align="center">
+        <Input defaultValue={apiKey} placeholder='api key' onChange={changeApiKey} style={{ marginBottom: 20 }} />
+        <Flex align='center'>
           <Input.TextArea
             ref={textareaRef}
             defaultValue={chatText}
-            placeholder="来，说点什么呗...Meta + Enter发送"
+            placeholder='来，说点什么呗...Meta + Enter发送'
             onChange={changeChatText}
             onKeyDown={onInputKeyDown}
             autoSize
@@ -830,13 +830,13 @@ const Home = () => {
           <Button
             style={{ margin: '0 10px' }}
             icon={<SendOutlined rotate={-60} />}
-            type="primary"
+            type='primary'
             disabled={isStream}
             onClick={onSubmit}
           >
             发送
           </Button>
-          <Button icon={<SendOutlined rotate={-60} />} type="primary" disabled={!isStream} onClick={onStop}>
+          <Button icon={<SendOutlined rotate={-60} />} type='primary' disabled={!isStream} onClick={onStop}>
             停止
           </Button>
         </Flex>
@@ -849,8 +849,8 @@ const Home = () => {
 
       <section style={{ position: 'relative', fontSize: 36 }}>
         I build
-        <FlipWords className="mx-1 px-4 py-2" words={['creative', 'interactive', 'beautiful', 'modern']} />
-        <span className="block text-black sm:inline">websites and apps.</span>
+        <FlipWords className='mx-1 px-4 py-2' words={['creative', 'interactive', 'beautiful', 'modern']} />
+        <span className='block text-black sm:inline'>websites and apps.</span>
         {/* <AnimateWave /> */}
       </section>
       {/* <section style={{ margin: 20 }}>
@@ -875,13 +875,13 @@ const Home = () => {
       </section>
       <section style={{ margin: 20 }}>
         <ResponsiveMasonry columnsCountBreakPoints={{ 350: 1, 750: 2, 900: 6 }}>
-          <Masonry gutter="10px">
+          <Masonry gutter='10px'>
             <section
               style={{
                 height: 100,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -889,7 +889,7 @@ const Home = () => {
                 height: 200,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -897,7 +897,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -905,7 +905,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -913,7 +913,7 @@ const Home = () => {
                 height: 200,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -921,7 +921,7 @@ const Home = () => {
                 height: 100,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -929,7 +929,7 @@ const Home = () => {
                 height: 200,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -937,7 +937,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -945,7 +945,7 @@ const Home = () => {
                 height: 100,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -953,7 +953,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -961,7 +961,7 @@ const Home = () => {
                 height: 100,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -969,7 +969,7 @@ const Home = () => {
                 height: 200,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -977,7 +977,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
             <section
@@ -985,7 +985,7 @@ const Home = () => {
                 height: 150,
                 width: '100%',
                 border: '1px solid #ccc',
-                background: '#aaa',
+                background: '#aaa'
               }}
             />
           </Masonry>
@@ -998,7 +998,7 @@ const Home = () => {
         <TagCloud />
       </section>
       <section style={{ margin: 20 }}>
-        <Marquee autoFill direction="left" gradient gradientColor="rgba(255, 255, 255, 0.8)">
+        <Marquee autoFill direction='left' gradient gradientColor='rgba(255, 255, 255, 0.8)'>
           <div
             style={{
               width: 200,
@@ -1007,7 +1007,7 @@ const Home = () => {
               textAlign: 'center',
               background: '#aaa',
               margin: '0 10px',
-              borderRadius: 8,
+              borderRadius: 8
               // transform: 'rotateX(60deg) rotateY(0deg) rotateZ(45deg)'
             }}
           >
@@ -1016,7 +1016,7 @@ const Home = () => {
         </Marquee>
       </section>
       <section style={{ margin: 20 }}>
-        <Marquee autoFill direction="right" gradient gradientColor="rgba(255, 255, 255, 0.8)">
+        <Marquee autoFill direction='right' gradient gradientColor='rgba(255, 255, 255, 0.8)'>
           <div
             style={{
               width: 200,
@@ -1025,7 +1025,7 @@ const Home = () => {
               textAlign: 'center',
               background: '#aaa',
               margin: '0 10px',
-              borderRadius: 8,
+              borderRadius: 8
             }}
           >
             Vue
diff --git a/src/pages/layout/proHeader/index.jsx b/src/pages/layout/proHeader/index.jsx
index 2f8125963..4bf43fb60 100644
--- a/src/pages/layout/proHeader/index.jsx
+++ b/src/pages/layout/proHeader/index.jsx
@@ -47,7 +47,7 @@ const ProHeader = () => {
       icon: <UserOutlined />,
       onClick: () => {
         redirectTo('/profile')
-      },
+      }
     },
     {
       key: '2',
@@ -55,7 +55,7 @@ const ProHeader = () => {
       icon: <SmileOutlined />,
       onClick: () => {
         redirectTo('/setting')
-      },
+      }
     },
     {
       key: '3',
@@ -63,7 +63,7 @@ const ProHeader = () => {
       icon: <SmileOutlined />,
       onClick: () => {
         redirectTo('/contact')
-      },
+      }
     },
     {
       key: '4',
@@ -72,8 +72,8 @@ const ProHeader = () => {
       onClick: () => {
         removeLocalStorage('token')
         redirectTo('/signin')
-      },
-    },
+      }
+    }
   ]
 
   const { myTheme, setMyTheme } = useProThemeContext()
@@ -83,7 +83,7 @@ const ProHeader = () => {
   }
 
   const {
-    token: { colorBgContainer, colorBorder },
+    token: { colorBgContainer, colorBorder }
   } = theme.useToken()
 
   return (
@@ -91,20 +91,20 @@ const ProHeader = () => {
       className={styles.header}
       style={{
         background: colorBgContainer,
-        borderBottom: `1px solid ${colorBorder}`,
+        borderBottom: `1px solid ${colorBorder}`
       }}
     >
-      <div aria-hidden="true" className={styles.logo} onClick={() => redirectTo('/')}>
+      <div aria-hidden='true' className={styles.logo} onClick={() => redirectTo('/')}>
         {/* Pro React <Tag>{process.env.DEPLOYED_ENV}</Tag> */}
-        <img src={Logo} alt="logo" />
-        <GradientAnimationText text="Pro React Admin" />
+        <img src={Logo} alt='logo' />
+        <GradientAnimationText text='Pro React Admin' />
       </div>
       <div className={styles.headerMeta}>
         <div className={styles.headerMenu}>
           <PrimaryNav />
         </div>
         <div className={styles.headerRight}>
-          <Space direction="horizontal" style={{ cursor: 'pointer', paddingRight: 8 }}>
+          <Space direction='horizontal' style={{ cursor: 'pointer', paddingRight: 8 }}>
             <SoundBar />
             <Switch
               // checkedChildren={<Icon component={LightSvg} />}
@@ -121,7 +121,7 @@ const ProHeader = () => {
           <Dropdown
             arrow
             menu={{
-              items,
+              items
             }}
           >
             <Space>
diff --git a/src/pages/layout/proTabs/index.jsx b/src/pages/layout/proTabs/index.jsx
index 93fe9e667..8aa5c46ca 100644
--- a/src/pages/layout/proTabs/index.jsx
+++ b/src/pages/layout/proTabs/index.jsx
@@ -22,12 +22,12 @@ const ProTabs = (props) => {
   const fullPath = pathname + search
 
   const {
-    token: { colorBgContainer },
+    token: { colorBgContainer }
   } = theme.useToken()
 
   const renderTabBar = (props, DefaultTabBar) => (
     <StickyBox offsetTop={0} style={{ zIndex: 10 }}>
-      <DefaultTabBar key={nanoid()} {...props} className="pro-tabs" style={{ background: colorBgContainer }} />
+      <DefaultTabBar key={nanoid()} {...props} className='pro-tabs' style={{ background: colorBgContainer }} />
     </StickyBox>
   )
 
@@ -35,7 +35,7 @@ const ProTabs = (props) => {
     document.querySelector('#container').scrollTo({
       top: 0,
       left: 0,
-      behavior: 'smooth',
+      behavior: 'smooth'
     })
   }, [pathname])
 
@@ -106,12 +106,12 @@ const ProTabs = (props) => {
   const tabRightMenu = [
     {
       label: '关闭其他',
-      key: 'other',
+      key: 'other'
     },
     {
       label: '全部关闭',
-      key: 'all',
-    },
+      key: 'all'
+    }
   ]
 
   const fixError = () => {
@@ -121,54 +121,56 @@ const ProTabs = (props) => {
   return (
     <Tabs
       hideAdd
-      type="editable-card"
+      type='editable-card'
       onChange={onChange}
       onTabClick={onTabClick}
       onTabScroll={onTabScroll}
       onEdit={onEdit}
       renderTabBar={renderTabBar}
-      className="layout-container"
-      id="container"
+      className='layout-container'
+      id='container'
       tabBarStyle={{
         zIndex: 2,
-        marginBottom: 0,
+        marginBottom: 0
       }}
       activeKey={activeKey}
       destroyOnHidden={false}
       tabBarExtraContent={{
         left: (
-          <Space align="center" size={30} style={{ margin: '0 25px' }}>
+          <Space align='center' size={30} style={{ margin: '0 25px' }}>
             <FireOutlined style={{ color: '#eb2f96', fontSize: 16 }} />
           </Space>
         ),
         right: (
           <>
             <Space style={{ padding: '0 5px' }}>
-              <Fullscreen ele="#fullScreenContent" placement="left" tips="主内容全屏" />
+              <Fullscreen ele='#fullScreenContent' placement='left' tips='主内容全屏' />
             </Space>
-            {panes.length > 2 ? (
-              <Dropdown
-                menu={{
-                  items: tabRightMenu,
-                  onClick: ({ key }) => {
-                    onTabContextMenu(key)
-                  },
-                }}
-                trigger={['hover']}
-              >
-                <Button type="link">
-                  More <DownOutlined />
-                </Button>
-              </Dropdown>
-            ) : null}
+            {panes.length > 2
+              ? (
+                <Dropdown
+                  menu={{
+                    items: tabRightMenu,
+                    onClick: ({ key }) => {
+                      onTabContextMenu(key)
+                    }
+                  }}
+                  trigger={['hover']}
+                >
+                  <Button type='link'>
+                    More <DownOutlined />
+                  </Button>
+                </Dropdown>
+                )
+              : null}
           </>
-        ),
+        )
       }}
       items={panes.map((pane) => ({
         label: (
           <>
             {pane.key === fullPath && pane.key !== '/404' && (
-              <SyncOutlined style={{ padding: '0 5px' }} onClick={refreshTab} title="刷新" spin={isReload} />
+              <SyncOutlined style={{ padding: '0 5px' }} onClick={refreshTab} title='刷新' spin={isReload} />
             )}
             {pane.i18nKey ? t(pane.i18nKey) : pane.title}
           </>
@@ -178,15 +180,17 @@ const ProTabs = (props) => {
         forceRender: true,
         children: (
           <MyErrorBoundary fixError={fixError}>
-            <div className="layout-tabpanel">
-              {isReload && pane.key === fullPath && pane.key !== '/404' ? (
-                <Loading tip="刷新中..." />
-              ) : (
-                <>{pane.content}</>
-              )}
+            <div className='layout-tabpanel'>
+              {isReload && pane.key === fullPath && pane.key !== '/404'
+                ? (
+                  <Loading tip='刷新中...' />
+                  )
+                : (
+                  <>{pane.content}</>
+                  )}
             </div>
           </MyErrorBoundary>
-        ),
+        )
       }))}
     />
   )
diff --git a/webpack/webpack.common.js b/webpack/webpack.common.js
index aac1b7ff7..36333aa95 100644
--- a/webpack/webpack.common.js
+++ b/webpack/webpack.common.js
@@ -37,7 +37,7 @@ switch (process.env.BUILD_GOAL) {
 
 const config = {
   entry: {
-    app: `${paths.src}/index.tsx`,
+    app: `${paths.src}/index.tsx`
   },
   output: {
     path: paths.build,
@@ -47,7 +47,7 @@ const config = {
     // library: '',
     // libraryTarget: 'umd',
     // chunkLoadingGlobal: '',
-    clean: true,
+    clean: true
     // contentBase: path.join(__dirname, "public"), // 配置额外的静态文件内容的访问路径
   },
   resolve: {
@@ -62,19 +62,19 @@ const config = {
       '@pages': path.resolve('./src/pages'),
       '@routers': path.resolve('./src/routers'),
       '@utils': path.resolve('./src/utils'),
-      '@theme': path.resolve('./src/theme'),
+      '@theme': path.resolve('./src/theme')
     },
     symlinks: false,
     modules: ['node_modules', paths.src],
-    cacheWithContext: false,
+    cacheWithContext: false
   },
   stats: 'verbose', // 输出详细的构建信息
   plugins: [
     new Dotenv({
-      path: path.resolve(__dirname, '..', dotEnv),
+      path: path.resolve(__dirname, '..', dotEnv)
     }),
     codeInspectorPlugin({
-      bundler: 'webpack',
+      bundler: 'webpack'
     }),
     new HtmlWebpackPlugin({
       title: isDev ? 'Pro React Dev' : 'Pro React Admin',
@@ -98,8 +98,8 @@ const config = {
             minifyCSS: true,
             minifyJS: true,
             minifyURLs: true,
-            useShortDoctype: true,
-          },
+            useShortDoctype: true
+          }
     }),
     new AntdDayjsWebpackPlugin(),
     new CaseSensitivePathsPlugin(),
@@ -113,14 +113,14 @@ const config = {
     new NodePolyfillPlugin(),
     new WebpackBar(),
     new ForkTsCheckerWebpackPlugin({
-      async: true,
+      async: true
     }),
     new ESLintWebpackPlugin({
       context: path.resolve(__dirname, '../src'),
       exclude: 'node_modules',
       cache: true,
-      cacheLocation: path.resolve(__dirname, '../node_modules/.cache/.eslintcache'),
-    }),
+      cacheLocation: path.resolve(__dirname, '../node_modules/.cache/.eslintcache')
+    })
   ],
   module: {
     // 将缺失的导出提示成错误而不是警告
@@ -129,8 +129,8 @@ const config = {
       {
         test: /\.m?js$/,
         resolve: {
-          fullySpecified: false,
-        },
+          fullySpecified: false
+        }
       },
       {
         test: /\.css$/,
@@ -140,11 +140,11 @@ const config = {
             loader: 'css-loader',
             options: {
               importLoaders: 1,
-              sourceMap: isDev,
-            },
+              sourceMap: isDev
+            }
           },
-          'postcss-loader',
-        ],
+          'postcss-loader'
+        ]
       },
       {
         test: /\.less$/i,
@@ -161,10 +161,10 @@ const config = {
                 localIdentName: isDev ? '[path][name]__[local]--[hash:base64:5]' : '[hash:base64:8]',
                 localIdentContext: paths.src,
                 namedExport: false,
-                exportLocalsConvention: 'camelCase',
+                exportLocalsConvention: 'camelCase'
               },
-              importLoaders: 2,
-            },
+              importLoaders: 2
+            }
           },
           {
             loader: 'postcss-loader',
@@ -176,25 +176,25 @@ const config = {
                     'postcss-preset-env',
                     {
                       autoprefixer: { flexbox: 'no-2009' },
-                      stage: 3,
-                    },
+                      stage: 3
+                    }
                   ],
-                  'postcss-normalize',
-                ],
+                  'postcss-normalize'
+                ]
               },
-              sourceMap: isDev,
-            },
+              sourceMap: isDev
+            }
           },
           {
             loader: 'less-loader',
             options: {
               sourceMap: isDev,
               lessOptions: {
-                javascriptEnabled: true,
-              },
-            },
-          },
-        ],
+                javascriptEnabled: true
+              }
+            }
+          }
+        ]
       },
       {
         test: /\.(js|jsx|ts|tsx)$/,
@@ -213,17 +213,17 @@ const config = {
           {
             loader: 'esbuild-loader',
             options: {
-              target: 'es2020',
-            },
+              target: 'es2020'
+            }
           },
           {
             loader: 'babel-loader',
             options: {
               cacheDirectory: true,
-              cacheCompression: false,
-            },
-          },
-        ],
+              cacheCompression: false
+            }
+          }
+        ]
       },
       {
         test: /\.(png|jpe?g|gif|webp|eot|ttf|woff|woff2|mp4|mp3|mkv|pdf)$/i,
@@ -231,29 +231,29 @@ const config = {
         parser: {
           // Conditions for converting to base64
           dataUrlCondition: {
-            maxSize: 25 * 1024, // 25kb
-          },
+            maxSize: 25 * 1024 // 25kb
+          }
         },
         generator: {
-          filename: 'images/[contenthash][ext][query]',
-        },
+          filename: 'images/[contenthash][ext][query]'
+        }
       },
       {
         test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
         use: [
           {
-            loader: 'babel-loader',
+            loader: 'babel-loader'
           },
           {
             loader: '@svgr/webpack',
             options: {
               babel: false,
-              icon: true,
-            },
-          },
-        ],
-      },
-    ],
+              icon: true
+            }
+          }
+        ]
+      }
+    ]
   },
   stats: {
     all: false,
@@ -261,22 +261,22 @@ const config = {
     warnings: true,
     errorDetails: true,
     moduleTrace: true, // 打印模块追踪信息，与--trace - warnings类似
-    excludeAssets: /node_modules/,
+    excludeAssets: /node_modules/
   },
   // 启用持久化缓存
   cache: {
     type: 'filesystem',
     buildDependencies: {
-      config: [__filename],
+      config: [__filename]
     },
-    cacheDirectory: path.resolve(__dirname, '../node_modules/.cache/webpack'),
+    cacheDirectory: path.resolve(__dirname, '../node_modules/.cache/webpack')
   },
   // 性能提示
   performance: {
     hints: isDev ? false : 'warning',
     maxEntrypointSize: 512000,
-    maxAssetSize: 512000,
-  },
+    maxAssetSize: 512000
+  }
 }
 
 if (USE_ANALYZE) {
diff --git a/webpack/webpack.dev.js b/webpack/webpack.dev.js
index ca0a791b2..d25403f49 100644
--- a/webpack/webpack.dev.js
+++ b/webpack/webpack.dev.js
@@ -19,16 +19,16 @@ const devWebpackConfig = merge(common, {
       progress: true,
       overlay: {
         errors: true,
-        warnings: false,
-      },
+        warnings: false
+      }
     },
     static: {
-      directory: path.join(__dirname, '../public'),
+      directory: path.join(__dirname, '../public')
     },
     compress: true,
     // open: true,
     hot: true,
-    proxy: devProxy,
+    proxy: devProxy
   },
   // watch: true,
   // watchOptions: {
@@ -38,8 +38,8 @@ const devWebpackConfig = merge(common, {
   // },
   plugins: [
     new ReactRefreshWebpackPlugin({
-      overlay: false,
-    }),
+      overlay: false
+    })
     // new webpack.debug.ProfilingPlugin({
     //   outputPath: path.join(__dirname, 'profiling/profileEvents.json'),
     // }),
@@ -55,20 +55,20 @@ const devWebpackConfig = merge(common, {
           test: /[\\/]node_modules[\\/]/,
           name: 'vendors',
           chunks: 'all',
-          priority: 10,
-        },
-      },
+          priority: 10
+        }
+      }
     },
     minimize: false,
     concatenateModules: false,
-    usedExports: true, // 启用tree shaking
-  },
+    usedExports: true // 启用tree shaking
+  }
 })
 module.exports = new Promise((resolve, reject) => {
   portfinder.getPort(
     {
       port: 8080, // 默认8080端口，若被占用，重复+1，直到找到可用端口或到stopPort才停止
-      stopPort: 65535, // maximum port
+      stopPort: 65535 // maximum port
     },
     (err, port) => {
       if (err) {
diff --git a/webpack/webpack.prod.js b/webpack/webpack.prod.js
index 9009311a0..20de9cb61 100644
--- a/webpack/webpack.prod.js
+++ b/webpack/webpack.prod.js
@@ -31,14 +31,14 @@ const prodWebpackConfig = merge(common, {
     new MiniCssExtractPlugin({
       filename: 'static/css/[name].[contenthash].css',
       chunkFilename: 'static/css/[name].[contenthash].css',
-      ignoreOrder: true,
+      ignoreOrder: true
     }),
     new PurgeCSSPlugin({
       paths: glob.sync(`${path.join(__dirname, 'src')}/**/*`, { nodir: true }),
       only: ['bundle', 'vendor', 'dist'],
       safelist: {
-        standard: [/^ant-/],
-      },
+        standard: [/^ant-/]
+      }
     }),
     // new CompressionWebpackPlugin({
     //   filename: '[path][base].gz',
@@ -54,11 +54,11 @@ const prodWebpackConfig = merge(common, {
           from: path.resolve(__dirname, '../public'),
           to: path.resolve(__dirname, '../dist'),
           globOptions: {
-            ignore: ['**/index.html'],
-          },
-        },
-      ],
-    }),
+            ignore: ['**/index.html']
+          }
+        }
+      ]
+    })
   ],
   optimization: {
     minimize: true,
@@ -66,9 +66,9 @@ const prodWebpackConfig = merge(common, {
       new CssMinimizerPlugin(),
       new EsbuildPlugin({
         target: 'es2015',
-        css: true,
+        css: true
       }),
-      new HtmlMinimizerPlugin(),
+      new HtmlMinimizerPlugin()
     ],
     splitChunks: {
       chunks: 'all',
@@ -83,14 +83,14 @@ const prodWebpackConfig = merge(common, {
           test: /[\\/]node_modules[\\/](react|react-dom)[\\/]/,
           name: 'react',
           chunks: 'all',
-          priority: 20,
+          priority: 20
         },
         // Ant Design分离
         antd: {
           test: /[\\/]node_modules[\\/](@ant-design|antd)[\\/]/,
           name: 'antd',
           chunks: 'all',
-          priority: 15,
+          priority: 15
         },
         // 其他第三方库
         vendor: {
@@ -98,7 +98,7 @@ const prodWebpackConfig = merge(common, {
           name: 'vendors',
           chunks: 'all',
           priority: 10,
-          minChunks: 2,
+          minChunks: 2
         },
         // 公共代码
         common: {
@@ -106,19 +106,19 @@ const prodWebpackConfig = merge(common, {
           minChunks: 2,
           chunks: 'all',
           priority: 5,
-          reuseExistingChunk: true,
-        },
-      },
+          reuseExistingChunk: true
+        }
+      }
     },
     runtimeChunk: {
-      name: 'runtime',
-    },
+      name: 'runtime'
+    }
   },
   performance: {
     hints: false,
     maxEntrypointSize: 512000,
-    maxAssetSize: 512000,
-  },
+    maxAssetSize: 512000
+  }
 })
 
 // if (useSentryMap) {