引入 husky，并全局重新格式化

src/app/(home)/@footer/page.tsx

@@ -6,24 +6,24 @@ export default function Footer(props: FooterProps) {
   return (
     <footer className="bg-gray-900 text-white overflow-hidden">
       <Wrap className="flex flex-col px-4 py-8 lg:p-12">
-        <div className={`flex-auto overflow-hidden flex flex-wrap justify-between`}>
+        <div className="flex-auto overflow-hidden flex flex-wrap justify-between">
           <div className="flex flex-col lg:items-center gap-2 lg:gap-6 max-lg:w-1/2">
             <img src="/qrcode.svg" alt="logo" className="flex-none w-20 h-20 sm:w-44 sm:h-44 bg-gray-100"/>
             <span className="text-sm ">关注我们查看更多资讯</span>
           </div>
 
-          <div className={`flex flex-col gap-2 lg:gap-4 max-lg:w-1/2`}>
+          <div className="flex flex-col gap-2 lg:gap-4 max-lg:w-1/2">
             <h3>商务合作</h3>
             <p className={`text-sm text-gray-500 `}>大客户经理:张经理</p>
             <p className={`text-sm text-gray-500 `}>电话/微信:18751847847</p>
             <p className={`text-sm text-gray-500 `}>QQ号:800180559</p>
-            <h3 className={`hidden sm:block`}>服务保障</h3>
-            <p className={`text-sm text-gray-500  hidden sm:block`}>售前服务</p>
-            <p className={`text-sm text-gray-500  hidden sm:block`}>技术支持</p>
+            <h3 className="hidden sm:block">服务保障</h3>
+            <p className="text-sm text-gray-500  hidden sm:block">售前服务</p>
+            <p className="text-sm text-gray-500  hidden sm:block">技术支持</p>
           </div>
 
           <SiteNavList
-            title={`站点导航`}
+            title="站点导航"
             items={[
               {name: `产品订购`, href: `#`},
               {name: `获取代理`, href: `#`},
@@ -33,7 +33,7 @@ export default function Footer(props: FooterProps) {
             ]}
           />
           <SiteNavList
-            title={`国内代理`}
+            title="国内代理"
             items={[
               {name: `短效代理`, href: `#`},
               {name: `长效代理`, href: `#`},
@@ -41,14 +41,14 @@ export default function Footer(props: FooterProps) {
             ]}
           />
           <SiteNavList
-            title={`全球代理`}
+            title="全球代理"
             items={[
               {name: `动态代理`, href: `#`},
               {name: `静态代理`, href: `#`},
             ]}
           />
           <SiteNavList
-            title={`使用案例`}
+            title="使用案例"
             items={[
               {name: `数据抓取`, href: `#`},
               {name: `媒体矩阵`, href: `#`},
@@ -61,7 +61,7 @@ export default function Footer(props: FooterProps) {
             ]}
           />
           <SiteNavList
-            title={`获取代理`}
+            title="获取代理"
             items={[
               {name: `API提取`, href: `#`},
               {name: `代码示例`, href: `#`},
@@ -69,7 +69,7 @@ export default function Footer(props: FooterProps) {
             ]}
           />
           <SiteNavList
-            title={`代理资讯`}
+            title="代理资讯"
             items={[
               {name: `产品功能`, href: `#`},
               {name: `使用教程`, href: `#`},
@@ -78,14 +78,15 @@ export default function Footer(props: FooterProps) {
           />
         </div>
 
-        <div className={`flex-none mt-6 pt-6 border-t border-gray-300 flex flex-col items-center`}>
+        <div className="flex-none mt-6 pt-6 border-t border-gray-300 flex flex-col items-center">
           <p className={`text-sm `}>
             声明：啊啊HTTP仅提供代理IP服务；严禁用户使用啊啊HTTP从事任何违法犯罪行为，产生的相关责任用户自负，对此啊啊HTTP不承担任何法律责任。
             <a href="#">自律公约</a>
           </p>
           <p className={`text-sm mt-3 `}>
             南京啊啊啊啊科技有限公司 版权所有网站地图
-            地址：啊啊啊啊啊啊啊啊啊大街57号楚翘城7幢404-405室</p>
+            地址：啊啊啊啊啊啊啊啊啊大街57号楚翘城7幢404-405室
+          </p>
           <p className={`text-sm mt-3 `}>
             电信业务经营许可证：B1-11111111
             苏ICP备111111111号-1
@@ -105,7 +106,7 @@ function SiteNavList(props: {
   }[]
 }) {
   return (
-    <div className={`max-lg:mt-4 w-full lg:w-auto`}>
+    <div className="max-lg:mt-4 w-full lg:w-auto">
       <h3>{props.title}</h3>
       <ul
         className={[
@@ -114,7 +115,7 @@ function SiteNavList(props: {
         ].join(' ')}>
         {props.items.map((item, index) => (
           <li key={index}>
-            <a href={item.href} className={`text-sm text-gray-500`}>{item.name}</a>
+            <a href={item.href} className="text-sm text-gray-500">{item.name}</a>
           </li>
         ))}
       </ul>

src/app/(home)/@header/_client/help.tsx

@@ -1,44 +1,41 @@
-import Link from "next/link"
+import Link from 'next/link'
 import Image, {StaticImageData} from 'next/image'
-import Wrap from "@/components/wrap"
+import Wrap from '@/components/wrap'
 import h01 from '@/assets/header/help/01.svg'
 import h02 from '@/assets/header/help/02.svg'
 import h03 from '@/assets/header/help/03.svg'
 import banner from '@/assets/header/help/banner.webp'
 
 export default function HelpMenu() {
-
-
-
   return (
     <Wrap className="w-full grid grid-cols-4 gap-4 justify-items-center">
       <Column
         icon={h01}
         title="提取IP"
         items={[
-          { lead: '短效动态IP提取', href: '#' },
-          { lead: '长效静态IP提取', href: '#' },
+          {lead: '短效动态IP提取', href: '#'},
+          {lead: '长效静态IP提取', href: '#'},
         ]}
       />
       <Column
         icon={h02}
         title="使用教程"
         items={[
-          { lead: '快速入手', href: '#' },
-          { lead: '代码下载', href: '#' },
-          { lead: 'API文档', href: '#' },
+          {lead: '快速入手', href: '#'},
+          {lead: '代码下载', href: '#'},
+          {lead: 'API文档', href: '#'},
         ]}
       />
       <Column
         icon={h03}
         title="产品功能"
         items={[
-          { lead: '常见问题', href: '#' },
-          { lead: '产品介绍', href: '#' },
-          { lead: '行业资讯', href: '#' },
+          {lead: '常见问题', href: '#'},
+          {lead: '产品介绍', href: '#'},
+          {lead: '行业资讯', href: '#'},
         ]}
       />
-      <Image src={banner} alt={`banner`} className={``} />
+      <Image src={banner} alt="banner" className=""/>
     </Wrap>
   )
 }
@@ -54,7 +51,7 @@ function Column(props: {
   return (
     <div className="flex flex-col gap-4">
       <h3 className="font-bold flex gap-3 items-center">
-        <Image src={props.icon} alt={props.title} className="w-10 h-10" />
+        <Image src={props.icon} alt={props.title} className="w-10 h-10"/>
         <span>{props.title}</span>
       </h3>
       <ul className=" text-gray-500 text-sm flex flex-col items-end gap-2">

src/app/(home)/@header/_client/navs.tsx

@@ -1,13 +1,13 @@
-import Image from "next/image"
-import Link from "next/link"
-import down from "@/assets/header/down.svg"
+import Image from 'next/image'
+import Link from 'next/link'
+import down from '@/assets/header/down.svg'
 
 export function LinkItem(props: {
   text: string
   href: string
 }) {
   return (
-    <li className={`group relative`}>
+    <li className="group relative">
       <Link
         href={props.href}
         className={[
@@ -35,7 +35,7 @@ export function MenuItem(props: {
   onLeave: () => void
 }) {
   return (
-    <li className={`group relative`}>
+    <li className="group relative">
       <button
         onPointerEnter={props.onEnter}
         onPointerLeave={props.onLeave}
@@ -50,7 +50,7 @@ export function MenuItem(props: {
         <span>{props.text}</span>
         <Image
           src={down}
-          alt={`drop_menu`}
+          alt="drop_menu"
           className={[
             `transition-transform duration-200 ease-in-out`,
             props.active
@@ -66,7 +66,7 @@ export function MenuItem(props: {
           props.active
             ? `bg-blue-500`
             : 'bg-transparent',
-        ].join(' ')} />
+        ].join(' ')}/>
     </li>
   )
-}
+}

src/app/(home)/@header/_client/product.tsx

@@ -35,26 +35,26 @@ export function Domestic(props: {}) {
     <section role="tabpanel" className="flex gap-16 mr-16">
       <div className="w-64 flex flex-col">
         <h3 className="mb-6 font-bold flex items-center gap-3">
-          <Image src={prod} alt={`产品`} className={`w-10 h-=10`}/>
+          <Image src={prod} alt="产品" className="w-10 h-=10"/>
           <span>代理产品</span>
         </h3>
 
         <DomesticLink
-          label={`动态IP`}
-          desc={`全国300+城市级定位节点`}
-          href={`/product?type=dynamic`}
+          label="动态IP"
+          desc="全国300+城市级定位节点"
+          href="/product?type=dynamic"
           discount={45}
         />
         <DomesticLink
-          label={`长效静态IP`}
-          desc={`IP 资源覆盖全国`}
-          href={`/product?type=dynamic`}
+          label="长效静态IP"
+          desc="IP 资源覆盖全国"
+          href="/product?type=dynamic"
           discount={45}
         />
         <DomesticLink
-          label={`固定IP`}
-          desc={`全国300+城市级定位节点`}
-          href={`/product?type=static`}
+          label="固定IP"
+          desc="全国300+城市级定位节点"
+          href="/product?type=static"
           discount={45}
         />
       </div>
@@ -85,7 +85,6 @@ export function Oversea(props: {}) {
 }
 
 export default function ProductMenu() {
-
   const [type, setType] = useState<TabType>('domestic')
 
   return (
@@ -105,7 +104,7 @@ export default function ProductMenu() {
       </div>
       <aside className="w-64">
         <h3 className="flex gap-3 items-center mb-4">
-          <Image src={anno} alt={`公告`} className={`w-10 h-10`}/>
+          <Image src={anno} alt="公告" className="w-10 h-10"/>
           <span>网站公告</span>
         </h3>
         <div className="flex flex-col gap-2">
@@ -140,14 +139,19 @@ export function DomesticLink(props: {
   }
 
   return (
-    <Link href={props.href} className={merge(
-      `transition-colors duration-150 ease-in-out`,
-      `p-4 rounded-lg flex flex-col gap-2 hover:bg-blue-50`,
-    )} onClick={onClick}>
+    <Link
+      href={props.href}
+      className={merge(
+        `transition-colors duration-150 ease-in-out`,
+        `p-4 rounded-lg flex flex-col gap-2 hover:bg-blue-50`,
+      )}
+      onClick={onClick}>
       <p className="flex gap-2">
         <span>{props.label}</span>
         <span className="text-orange-500 text-xs text-light px-2 py-1 bg-orange-50 rounded-full">
-          折扣{props.discount}%
+          折扣
+          {props.discount}
+          %
         </span>
       </p>
       <p className="text-gray-400 text-sm">

src/app/(home)/@header/_client/solution.tsx

@@ -1,17 +1,16 @@
-import Image from "next/image"
-import Wrap from "@/components/wrap"
-import s01 from "@/assets/header/solution/01.svg"
-import s02 from "@/assets/header/solution/02.svg"
-import s03 from "@/assets/header/solution/03.svg"
-import s04 from "@/assets/header/solution/04.svg"
-import s05 from "@/assets/header/solution/05.svg"
-import s06 from "@/assets/header/solution/06.svg"
-import s07 from "@/assets/header/solution/07.svg"
-import s08 from "@/assets/header/solution/08.svg"
+import Image from 'next/image'
+import Wrap from '@/components/wrap'
+import s01 from '@/assets/header/solution/01.svg'
+import s02 from '@/assets/header/solution/02.svg'
+import s03 from '@/assets/header/solution/03.svg'
+import s04 from '@/assets/header/solution/04.svg'
+import s05 from '@/assets/header/solution/05.svg'
+import s06 from '@/assets/header/solution/06.svg'
+import s07 from '@/assets/header/solution/07.svg'
+import s08 from '@/assets/header/solution/08.svg'
 import {StaticImageData} from 'next/image'
 
 export default function SolutionMenu() {
-
   return (
     <Wrap className="grid grid-cols-4 auto-rows-fr gap-4">
       <SolutionItem
@@ -70,7 +69,7 @@ function SolutionItem(props: {
         `transition-colors duration-200 hover:bg-blue-50`,
       ].join(' ')}
     >
-      <Image src={props.icon} alt={props.title} className="w-10 h-10" />
+      <Image src={props.icon} alt={props.title} className="w-10 h-10"/>
       <div className="flex flex-col gap-1">
         <h3 className="font-bold">{props.title}</h3>
         <p className="text-gray-400 text-sm">{props.desc}</p>

src/app/(home)/@header/page.tsx

@@ -4,7 +4,7 @@ export type HeaderProps = {}
 
 export default async function Header(props: HeaderProps) {
   return (
-    <header className={`fixed top-0 w-full z-10`}>
+    <header className="fixed top-0 w-full z-10">
       <Provider/>
     </header>
   )

src/app/(home)/collect/page.tsx

@@ -6,7 +6,7 @@ export type CollectPageProps = {}
 
 export default function CollectPage(props: CollectPageProps) {
   return (
-    <main className={`mt-20 flex flex-col gap-4`}>
+    <main className="mt-20 flex flex-col gap-4">
       <Wrap className="flex flex-col py-8 gap-8">
         <BreadCrumb items={[
           {label: 'IP 提取', href: '/collect'},

src/app/(home)/layout.tsx

@@ -8,7 +8,7 @@ export type HomeLayoutProps = {
 
 export default function HomeLayout(props: HomeLayoutProps) {
   return (
-    <div className={`overflow-auto bg-blue-50 flex flex-col items-stretch relative`}>
+    <div className="overflow-auto bg-blue-50 flex flex-col items-stretch relative">
       {/* 页头 */}
       <Header/>
 

src/app/(home)/page.tsx

@@ -4,25 +4,25 @@ import Image from 'next/image'
 
 export default function Home() {
   return (
-    <main className={`flex flex-col gap-16 lg:gap-32 mb-16 lg:mb-32`}>
+    <main className="flex flex-col gap-16 lg:gap-32 mb-16 lg:mb-32">
 
       {/* banner */}
       <section className={`w-full bg-[url('/banner.webp')] bg-cover bg-[center_right_40%]`}>
-        <Wrap className={`pt-64 pb-48 max-md:pt-32 max-md:pb-24`}>
-          <h1 className={`text-4xl`}>安全，稳定，快速，合规的代理服务器</h1>
-          <p className={`mt-10 text-gray-500`}>遍布全国的代理服务器节点为用户提供智能可靠的IP代理服务</p>
+        <Wrap className="pt-64 pb-48 max-md:pt-32 max-md:pb-24">
+          <h1 className="text-4xl">安全，稳定，快速，合规的代理服务器</h1>
+          <p className="mt-10 text-gray-500">遍布全国的代理服务器节点为用户提供智能可靠的IP代理服务</p>
 
-          <div className={`mt-24 max-md:mt-14 flex gap-8 max-md:flex-col`}>
-            <p className={`flex gap-4 items-center`}>
-              <Image src={`/check.svg`} alt={`checkbox`} width={24} height={24}/>
+          <div className="mt-24 max-md:mt-14 flex gap-8 max-md:flex-col">
+            <p className="flex gap-4 items-center">
+              <Image src="/check.svg" alt="checkbox" width={24} height={24}/>
               <span className={`lg:text-lg `}>全国200+城市节点</span>
             </p>
-            <p className={`flex gap-4 items-center`}>
-              <Image src={`/check.svg`} alt={`checkbox`} width={24} height={24}/>
+            <p className="flex gap-4 items-center">
+              <Image src="/check.svg" alt="checkbox" width={24} height={24}/>
               <span className={`lg:text-lg `}>300+城市级精准定位</span>
             </p>
-            <p className={`flex gap-4 items-center`}>
-              <Image src={`/check.svg`} alt={`checkbox`} width={24} height={24}/>
+            <p className="flex gap-4 items-center">
+              <Image src="/check.svg" alt="checkbox" width={24} height={24}/>
               <span className={`lg:text-lg `}>低延迟&高并发提取</span>
             </p>
           </div>
@@ -38,55 +38,62 @@ export default function Home() {
       </section>
 
       {/* 数据展示 */}
-      <Section title={`覆盖全国的IP资源及超大的带宽线路`}>
-        <ul className={`shadow-[0_0_20px_4px] shadow-blue-50 p-8 flex max-lg:flex-col`}>
-          <li className={`flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200`}>
-            <p className={`text-xl`}>全国城市线路数量</p>
-            <p className={`mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2`}>350+</p>
-            <div className={`lg:hidden w-24 border-b mt-4 border-gray-200`}></div>
+      <Section title="覆盖全国的IP资源及超大的带宽线路">
+        <ul className="shadow-[0_0_20px_4px] shadow-blue-50 p-8 flex max-lg:flex-col">
+          <li className="flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200">
+            <p className="text-xl">全国城市线路数量</p>
+            <p className="mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2">350+</p>
+            <div className="lg:hidden w-24 border-b mt-4 border-gray-200"></div>
           </li>
-          <li className={`flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200`}>
-            <p className={`text-xl`}>每日更新IP数量</p>
-            <p className={`mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2`}>1,350,129</p>
-            <div className={`lg:hidden w-24 border-b mt-4 border-gray-200`}></div>
+          <li className="flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200">
+            <p className="text-xl">每日更新IP数量</p>
+            <p className="mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2">1,350,129</p>
+            <div className="lg:hidden w-24 border-b mt-4 border-gray-200"></div>
           </li>
-          <li className={`flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200`}>
-            <p className={`text-xl`}>用户量</p>
-            <p className={`mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2`}>26,578</p>
-            <div className={`lg:hidden w-24 border-b mt-4 border-gray-200`}></div>
+          <li className="flex-1 flex flex-col items-center justify-center lg:border-r max-lg:mb-4 border-gray-200">
+            <p className="text-xl">用户量</p>
+            <p className="mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2">26,578</p>
+            <div className="lg:hidden w-24 border-b mt-4 border-gray-200"></div>
           </li>
-          <li className={`flex-1 flex flex-col items-center justify-center`}>
-            <p className={`text-xl`}>IP可用率</p>
-            <p className={`mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2`}>99%</p>
+          <li className="flex-1 flex flex-col items-center justify-center">
+            <p className="text-xl">IP可用率</p>
+            <p className="mt-9 max-lg:mt-2 text-5xl bg-gradient-to-t from-blue-500 to-cyan-400 bg-clip-text text-transparent font-bold pb-2 -mb-2">99%</p>
           </li>
         </ul>
-        <img src={`/map.webp`} alt={`map`} className="w-[1200px]"/>
+        <img src="/map.webp" alt="map" className="w-[1200px]"/>
       </Section>
 
-
       {/* 优势 1 */}
-      <Section title={`HTTP安全合规的代理IP资源池`}>
+      <Section title="HTTP安全合规的代理IP资源池">
         <ul
           className={[
             `grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8`,
           ].join(' ')}>
           <Sec3Item
-            icon={`s1-1`} title={`短期动态IP池`} terms={[
+            icon="s1-1"
+            title="短期动态IP池"
+            terms={[
               {icon: `s1-check`, text: `IP时效3-30分钟(可定制)`},
               {icon: `s1-check`, text: `支持高并发提取`},
             ]}/>
           <Sec3Item
-            icon={`s1-2`} title={`长期静态IP池`} terms={[
+            icon="s1-2"
+            title="长期静态IP池"
+            terms={[
               {icon: `s1-check`, text: `IP覆盖全国各地`},
               {icon: `s1-check`, text: `平均响应时长：0.03s`},
             ]}/>
           <Sec3Item
-            icon={`s1-3`} title={`固定IP池`} terms={[
+            icon="s1-3"
+            title="固定IP池"
+            terms={[
               {icon: `s1-check`, text: `稳定长输不掉线`},
               {icon: `s1-check`, text: `全国热门静态IP线路`},
             ]}/>
           <Sec3Item
-            icon={`s1-4`} title={`企业级定制池`} terms={[
+            icon="s1-4"
+            title="企业级定制池"
+            terms={[
               {icon: `s1-check`, text: `可视化监控设计`},
               {icon: `s1-check`, text: `技术团队现场支持`},
             ]}/>
@@ -94,31 +101,31 @@ export default function Home() {
       </Section>
 
       {/* 优势 2 */}
-      <Section title={`HTTP 产品优势`}>
-        <div className={`flex gap-36`}>
-          <ul className={`flex-1 flex flex-col gap-6`}>
-            <Sec4Item icon={`s4-1-1`} title={`安全合规`} description={`国内三大运营商支持`}/>
-            <Sec4Item icon={`s4-1-2`} title={`稳定链接`} description={`IP纯净度高达99.9%`}/>
-            <Sec4Item icon={`s4-1-3`} title={`超匿名性`} description={`稳定传输，保护隐私安全`}/>
+      <Section title="HTTP 产品优势">
+        <div className="flex gap-36">
+          <ul className="flex-1 flex flex-col gap-6">
+            <Sec4Item icon="s4-1-1" title="安全合规" description="国内三大运营商支持"/>
+            <Sec4Item icon="s4-1-2" title="稳定链接" description="IP纯净度高达99.9%"/>
+            <Sec4Item icon="s4-1-3" title="超匿名性" description="稳定传输，保护隐私安全"/>
           </ul>
-          <img src={`/s4-1-main.webp`} alt={`s2-1-main`} className={`w-0 flex-1 object-contain max-lg:hidden`}/>
+          <img src="/s4-1-main.webp" alt="s2-1-main" className="w-0 flex-1 object-contain max-lg:hidden"/>
         </div>
 
-        <div className={`flex gap-36`}>
-          <img src={`/s4-2-main.webp`} alt={`s2-1-main`} className={`w-0 flex-1 object-contain max-lg:hidden`}/>
-          <ul className={`flex-1 flex flex-col gap-6`}>
-            <Sec4Item icon={`s4-2-1`} title={`API接口文档`} description={`与第三方软件轻松集成`}/>
-            <Sec4Item icon={`s4-2-2`} title={`多种编程语言代码`} description={`C语言、GO语言、Python...`}/>
-            <Sec4Item icon={`s4-2-3`} title={`双重认证方式`} description={`API提取+账密认证`}/>
+        <div className="flex gap-36">
+          <img src="/s4-2-main.webp" alt="s2-1-main" className="w-0 flex-1 object-contain max-lg:hidden"/>
+          <ul className="flex-1 flex flex-col gap-6">
+            <Sec4Item icon="s4-2-1" title="API接口文档" description="与第三方软件轻松集成"/>
+            <Sec4Item icon="s4-2-2" title="多种编程语言代码" description="C语言、GO语言、Python..."/>
+            <Sec4Item icon="s4-2-3" title="双重认证方式" description="API提取+账密认证"/>
           </ul>
         </div>
       </Section>
 
       {/* 行业资讯 */}
-      <Section title={`行业资讯`}>
-        <div className={`flex gap-8 max-md:gap-4`}>
-          <button className={`px-4 max-md:-mx-4`}>
-            <img src={`/next.svg`} alt={`prev`} className={`rotate-180`}/>
+      <Section title="行业资讯">
+        <div className="flex gap-8 max-md:gap-4">
+          <button className="px-4 max-md:-mx-4">
+            <img src="/next.svg" alt="prev" className="rotate-180"/>
           </button>
 
           <div
@@ -126,26 +133,26 @@ export default function Home() {
               `shadow-[4px_4px_20px_4px] shadow-blue-50 rounded-lg`,
               `flex p-14 md:gap-14 max-md:flex-col max-md:p-4`,
             ].join(' ')}>
-            <img src="/s3-main.webp" alt="tumb" className={`w-2/3 md:flex-1 md:w-0 object-cover max-md:self-center`}/>
-            <div className={`flex-2 flex flex-col justify-between gap-4`}>
-              <h3 className={`flex justify-between`}>
-                <span className={`text-xl`}>我是标题</span>
-                <sub className={`text-sm text-gray-500`}>2025-03-04</sub>
+            <img src="/s3-main.webp" alt="tumb" className="w-2/3 md:flex-1 md:w-0 object-cover max-md:self-center"/>
+            <div className="flex-2 flex flex-col justify-between gap-4">
+              <h3 className="flex justify-between">
+                <span className="text-xl">我是标题</span>
+                <sub className="text-sm text-gray-500">2025-03-04</sub>
               </h3>
-              <p className={`text-gray-400 md:leading-12`}>
+              <p className="text-gray-400 md:leading-12">
                 我是内容我是内容我是内容我是内容我是内容我是容我是内容我是内容内容我是内容我是内容我是内我是内容我是内容我是内容我是内容我是内容...
               </p>
-              <div className={`flex justify-end`}>
-                <a href="#" className={`text-sm text-gray-500 flex items-center gap-4`}>
+              <div className="flex justify-end">
+                <a href="#" className="text-sm text-gray-500 flex items-center gap-4">
                   更多详情
-                  <img src={`/next.svg`} alt={`more`} className={`h-4 fill-gray-400`}/>
+                  <img src="/next.svg" alt="more" className="h-4 fill-gray-400"/>
                 </a>
               </div>
             </div>
           </div>
 
-          <button className={`px-4 max-md:-mx-4`}>
-            <img src={`/next.svg`} alt={`prev`}/>
+          <button className="px-4 max-md:-mx-4">
+            <img src="/next.svg" alt="prev"/>
           </button>
         </div>
       </Section>
@@ -157,11 +164,10 @@ function Section(props: {
   title: string
   children: ReactNode
 }) {
-
   return (
     <section>
-      <div className={`max-w-[1232px] mx-auto px-4 flex flex-col items-stretch`}>
-        <h2 className={`text-center text-3xl mb-8 lg:mb-24`}>{props.title}</h2>
+      <div className="max-w-[1232px] mx-auto px-4 flex flex-col items-stretch">
+        <h2 className="text-center text-3xl mb-8 lg:mb-24">{props.title}</h2>
         {props.children}
       </div>
     </section>
@@ -182,13 +188,13 @@ function Sec3Item(props: {
         `p-8 flex flex-col gap-5 shadow-[4px_4px_20px_4px] shadow-blue-50 bg-white rounded-lg`,
         `max-md:items-center`,
       ].join(' ')}>
-      <img src={`/${props.icon}.webp`} alt={`s1-1`} aria-hidden className="w-44 h-44 object-cover"/>
-      <h3 className={`text-xl`}>{props.title}</h3>
-      <div className={`flex flex-col gap-3`}>
+      <img src={`/${props.icon}.webp`} alt="s1-1" aria-hidden className="w-44 h-44 object-cover"/>
+      <h3 className="text-xl">{props.title}</h3>
+      <div className="flex flex-col gap-3">
         {props.terms.map((item, index) => {
           return (
-            <p key={index} className={`text-sm text-gray-500 flex gap-3 items-center`}>
-              <img src={`/${item.icon}.svg`} alt={`check`} aria-hidden className={`w-5 h-5`}/>
+            <p key={index} className="text-sm text-gray-500 flex gap-3 items-center">
+              <img src={`/${item.icon}.svg`} alt="check" aria-hidden className="w-5 h-5"/>
               <span>{item.text}</span>
             </p>
           )
@@ -204,10 +210,10 @@ function Sec4Item(props: {
   description: string
 }) {
   return (
-    <li className={`flex gap-8 items-center p-4 lg:p-8 shadow-[4px_4px_20px_4px] shadow-blue-50 rounded-lg`}>
-      <img src={`/${props.icon}.webp`} alt={`s2-1-1`} aria-hidden className="w-24 h-24 object-contain"/>
-      <div className={`flex flex-col gap-3`}>
-        <h3 className={`text-xl`}>{props.title}</h3>
+    <li className="flex gap-8 items-center p-4 lg:p-8 shadow-[4px_4px_20px_4px] shadow-blue-50 rounded-lg">
+      <img src={`/${props.icon}.webp`} alt="s2-1-1" aria-hidden className="w-24 h-24 object-contain"/>
+      <div className="flex flex-col gap-3">
+        <h3 className="text-xl">{props.title}</h3>
         <p>{props.description}</p>
       </div>
     </li>

src/app/(home)/product/page.tsx

@@ -6,7 +6,7 @@ export type ProductPageProps = {}
 
 export default function ProductPage(props: ProductPageProps) {
   return (
-    <main className={`mt-20`}>
+    <main className="mt-20">
       <Wrap className="flex flex-col py-8 gap-4">
         <BreadCrumb items={[
           {label: '产品中心', href: '/product'},
@@ -16,4 +16,3 @@ export default function ProductPage(props: ProductPageProps) {
     </main>
   )
 }
-