diff --git a/app/(app)/analytics/geo/page.tsx b/app/(app)/analytics/geo/page.tsx
index 8cb0897..ebe5c46 100644
--- a/app/(app)/analytics/geo/page.tsx
+++ b/app/(app)/analytics/geo/page.tsx
@@ -92,7 +92,7 @@ export default function GeoAnalyticsPage() {
                   <td className="px-6 py-4 whitespace-nowrap text-sm">
                     <div className="flex items-center">
                       <span className="mr-2 text-foreground">{item.percentage.toFixed(1)}%</span>
-                      <div className="w-24 bg-gray-200 dark:bg-gray-700 rounded-full h-2">
+                      <div className="w-24 bg-gray-200 rounded-full h-2">
                         <div
                           className="bg-blue-500 h-2 rounded-full"
                           style={{ width: `${item.percentage}%` }}
diff --git a/app/(app)/page.tsx b/app/(app)/page.tsx
index f762589..bf7e882 100644
--- a/app/(app)/page.tsx
+++ b/app/(app)/page.tsx
@@ -4,51 +4,51 @@ export default function Home() {
   return (
     <div className="container mx-auto px-4">
       <div className="max-w-2xl mx-auto py-16">
-        <h1 className="text-4xl font-bold text-gray-900 dark:text-gray-100 mb-8">
+        <h1 className="text-4xl font-bold text-gray-900 mb-8">
           Welcome to ShortURL Analytics
         </h1>
         <div className="grid gap-6">
           <Link
             href="/dashboard"
-            className="block p-6 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-shadow"
+            className="block p-6 bg-white rounded-lg shadow hover:shadow-md transition-shadow"
           >
-            <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">
+            <h2 className="text-xl font-semibold text-gray-900 mb-2">
               Dashboard
             </h2>
-            <p className="text-gray-600 dark:text-gray-400">
+            <p className="text-gray-600">
               View your overall analytics and key metrics
             </p>
           </Link>
           <Link
             href="/events"
-            className="block p-6 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-shadow"
+            className="block p-6 bg-white rounded-lg shadow hover:shadow-md transition-shadow"
           >
-            <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">
+            <h2 className="text-xl font-semibold text-gray-900 mb-2">
               Events
             </h2>
-            <p className="text-gray-600 dark:text-gray-400">
+            <p className="text-gray-600">
               Track and analyze event data
             </p>
           </Link>
           <Link
             href="/analytics/geo"
-            className="block p-6 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-shadow"
+            className="block p-6 bg-white rounded-lg shadow hover:shadow-md transition-shadow"
           >
-            <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">
+            <h2 className="text-xl font-semibold text-gray-900 mb-2">
               Geographic Analysis
             </h2>
-            <p className="text-gray-600 dark:text-gray-400">
+            <p className="text-gray-600">
               Explore visitor locations and geographic patterns
             </p>
           </Link>
           <Link
             href="/analytics/devices"
-            className="block p-6 bg-white dark:bg-gray-800 rounded-lg shadow hover:shadow-md transition-shadow"
+            className="block p-6 bg-white rounded-lg shadow hover:shadow-md transition-shadow"
           >
-            <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100 mb-2">
+            <h2 className="text-xl font-semibold text-gray-900 mb-2">
               Device Analytics
             </h2>
-            <p className="text-gray-600 dark:text-gray-400">
+            <p className="text-gray-600">
               Understand how users access your links
             </p>
           </Link>
diff --git a/app/(swagger)/swagger/page.tsx b/app/(swagger)/swagger/page.tsx
index c73ef64..7568e8d 100644
--- a/app/(swagger)/swagger/page.tsx
+++ b/app/(swagger)/swagger/page.tsx
@@ -1,8 +1,20 @@
 "use client";
 
 import { useEffect } from 'react';
-import SwaggerUI from 'swagger-ui-react';
-import 'swagger-ui-react/swagger-ui.css';
+
+// 动态导入，避免生产环境问题
+let SwaggerUI = () => <div>Swagger UI is not available in production</div>;
+let swaggerCss = null;
+
+// 只在开发环境中导入 Swagger UI
+if (process.env.NODE_ENV === 'development') {
+  try {
+    SwaggerUI = require('swagger-ui-react').default;
+    require('swagger-ui-react/swagger-ui.css');
+  } catch (e) {
+    console.error('Failed to load Swagger UI:', e);
+  }
+}
 
 export default function SwaggerPage() {
   useEffect(() => {
@@ -10,6 +22,21 @@ export default function SwaggerPage() {
     document.title = 'API Documentation - ShortURL Analytics';
   }, []);
 
+  // 生产环境显示替代内容
+  if (process.env.NODE_ENV !== 'development') {
+    return (
+      <div className="p-8 max-w-4xl mx-auto">
+        <h1 className="text-2xl font-bold mb-4">API Documentation</h1>
+        <p className="mb-4">
+          Swagger UI is only available in development environment.
+        </p>
+        <p>
+          Please run the application in development mode to access the full API documentation.
+        </p>
+      </div>
+    );
+  }
+
   // Swagger配置
   const swaggerConfig = {
     openapi: '3.0.0',
diff --git a/app/components/analytics/DeviceAnalytics.tsx b/app/components/analytics/DeviceAnalytics.tsx
index 290d905..e191301 100644
--- a/app/components/analytics/DeviceAnalytics.tsx
+++ b/app/components/analytics/DeviceAnalytics.tsx
@@ -22,16 +22,16 @@ function StatCard({ title, items }: { title: string; items: { name: string; coun
   };
 
   return (
-    <div className="bg-white dark:bg-gray-800 rounded-lg shadow p-6">
-      <h3 className="text-lg font-semibold text-gray-900 dark:text-gray-100 mb-4">{title}</h3>
+    <div className="bg-white rounded-lg shadow p-6">
+      <h3 className="text-lg font-semibold text-gray-900 mb-4">{title}</h3>
       <div className="space-y-4">
         {items.map((item, index) => (
           <div key={index}>
-            <div className="flex justify-between text-sm text-gray-600 dark:text-gray-400 mb-1">
+            <div className="flex justify-between text-sm text-gray-600 mb-1">
               <span>{item.name || 'Unknown'}</span>
               <span>{formatNumber(item.count)} ({formatPercent(item.percentage)}%)</span>
             </div>
-            <div className="w-full bg-gray-200 dark:bg-gray-700 rounded-full h-2">
+            <div className="w-full bg-gray-200 rounded-full h-2">
               <div
                 className="bg-blue-500 h-2 rounded-full"
                 style={{ width: `${item.percentage || 0}%` }}
diff --git a/app/components/analytics/GeoAnalytics.tsx b/app/components/analytics/GeoAnalytics.tsx
index 41dd942..6eeaadd 100644
--- a/app/components/analytics/GeoAnalytics.tsx
+++ b/app/components/analytics/GeoAnalytics.tsx
@@ -23,39 +23,39 @@ export default function GeoAnalytics({ data }: GeoAnalyticsProps) {
 
   return (
     <div className="overflow-x-auto">
-      <table className="min-w-full divide-y divide-gray-200 dark:divide-gray-700">
-        <thead className="bg-gray-50 dark:bg-gray-800">
+      <table className="min-w-full divide-y divide-gray-200">
+        <thead className="bg-gray-50">
           <tr>
-            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
               Location
             </th>
-            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
               Visits
             </th>
-            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
               Unique Visitors
             </th>
-            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+            <th scope="col" className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
               Percentage
             </th>
           </tr>
         </thead>
-        <tbody className="bg-white dark:bg-gray-900 divide-y divide-gray-200 dark:divide-gray-700">
+        <tbody className="bg-white divide-y divide-gray-200">
           {data.map((item, index) => (
-            <tr key={index} className={index % 2 === 0 ? 'bg-white dark:bg-gray-900' : 'bg-gray-50 dark:bg-gray-800'}>
-              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100">
+            <tr key={index} className={index % 2 === 0 ? 'bg-white' : 'bg-gray-50'}>
+              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                 {item.city ? `${item.city}, ${item.region}, ${item.country}` : item.region ? `${item.region}, ${item.country}` : item.country || item.location || 'Unknown'}
               </td>
-              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100">
+              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                 {formatNumber(item.visits)}
               </td>
-              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100">
+              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                 {formatNumber(item.uniqueVisitors || item.visitors)}
               </td>
-              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900 dark:text-gray-100">
+              <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                 <div className="flex items-center">
                   <span className="mr-2">{formatPercent(item.percentage)}%</span>
-                  <div className="w-24 bg-gray-200 dark:bg-gray-700 rounded-full h-2">
+                  <div className="w-24 bg-gray-200 rounded-full h-2">
                     <div
                       className="bg-blue-500 h-2 rounded-full"
                       style={{ width: `${item.percentage || 0}%` }}
diff --git a/app/components/ui/DateRangePicker.tsx b/app/components/ui/DateRangePicker.tsx
index 4abc6cb..827cbcb 100644
--- a/app/components/ui/DateRangePicker.tsx
+++ b/app/components/ui/DateRangePicker.tsx
@@ -41,7 +41,7 @@ export function DateRangePicker({ value, onChange }: DateRangePickerProps) {
   return (
     <div className="flex items-center space-x-4">
       <div>
-        <label htmlFor="from" className="block text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+        <label htmlFor="from" className="block text-sm font-medium text-gray-500 mb-1">
           From
         </label>
         <input
@@ -50,11 +50,11 @@ export function DateRangePicker({ value, onChange }: DateRangePickerProps) {
           value={from}
           onChange={handleFromChange}
           max={to}
-          className="block w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-md text-sm text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+          className="block w-full px-3 py-2 bg-white border border-gray-300 rounded-md text-sm text-gray-900 focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
         />
       </div>
       <div>
-        <label htmlFor="to" className="block text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+        <label htmlFor="to" className="block text-sm font-medium text-gray-500 mb-1">
           To
         </label>
         <input
@@ -63,7 +63,7 @@ export function DateRangePicker({ value, onChange }: DateRangePickerProps) {
           value={to}
           onChange={handleToChange}
           min={from}
-          className="block w-full px-3 py-2 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-md text-sm text-gray-900 dark:text-gray-100 focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+          className="block w-full px-3 py-2 bg-white border border-gray-300 rounded-md text-sm text-gray-900 focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
         />
       </div>
     </div>
diff --git a/app/layout.tsx b/app/layout.tsx
index 83deb4c..07a63ee 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -12,7 +12,7 @@ export default function RootLayout({
   children: React.ReactNode;
 }>) {
   return (
-    <html lang="en" suppressHydrationWarning>
+    <html lang="en" className="light" suppressHydrationWarning>
       <body>
         {children}
       </body>
diff --git a/app/page.tsx b/app/page.tsx
index 4128c67..c1e4e72 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -48,10 +48,10 @@ export default function HomePage() {
     <div className="container mx-auto px-4">
       <div className="max-w-4xl mx-auto">
         <div className="text-center mb-12">
-          <h1 className="text-4xl font-bold text-gray-900 dark:text-gray-100 mb-4">
+          <h1 className="text-4xl font-bold text-gray-900 mb-4">
             Welcome to ShortURL Analytics
           </h1>
-          <p className="text-lg text-gray-600 dark:text-gray-400">
+          <p className="text-lg text-gray-600">
             Get detailed insights into your link performance and visitor behavior
           </p>
         </div>
@@ -61,19 +61,19 @@ export default function HomePage() {
             <Link
               key={section.title}
               href={section.href}
-              className="group block p-6 bg-white dark:bg-gray-800 rounded-lg shadow-sm hover:shadow-md transition-shadow duration-200"
+              className="group block p-6 bg-white rounded-lg shadow-sm hover:shadow-md transition-shadow duration-200"
             >
               <div className="flex items-center mb-4">
-                <div className="p-2 bg-blue-100 dark:bg-blue-900 rounded-lg mr-4">
-                  <div className="text-blue-600 dark:text-blue-300">
+                <div className="p-2 bg-blue-100 rounded-lg mr-4">
+                  <div className="text-blue-600">
                     {section.icon}
                   </div>
                 </div>
-                <h2 className="text-xl font-semibold text-gray-900 dark:text-gray-100 group-hover:text-blue-600 dark:group-hover:text-blue-400 transition-colors duration-200">
+                <h2 className="text-xl font-semibold text-gray-900 group-hover:text-blue-600 transition-colors duration-200">
                   {section.title}
                 </h2>
               </div>
-              <p className="text-gray-600 dark:text-gray-400">
+              <p className="text-gray-600">
                 {section.description}
               </p>
             </Link>
diff --git a/next.config.js b/next.config.js
index cd39660..fbccc35 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,18 +1,33 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  // 启用 webpack 配置
-  webpack: (config) => {
+  // 设置需要转译的包
+  transpilePackages: ['swagger-ui-react'],
+  
+  // 禁用严格模式，避免开发时重复渲染
+  reactStrictMode: false,
+  
+  webpack: (config, { dev }) => {
     // 添加 CSS 处理规则
     config.module.rules.push({
       test: /\.css$/,
       type: 'asset/source',
     });
-
+    
+    // 仅在生产环境中排除 Swagger
+    if (!dev) {
+      config.resolve.alias = {
+        ...config.resolve.alias,
+        'swagger-ui-react': false,
+      };
+    }
+    
     return config;
   },
+  
   eslint: {
     ignoreDuringBuilds: true,
   },
+  
   typescript: {
     ignoreBuildErrors: true,
   },
diff --git a/next.config.ts b/next.config.ts
deleted file mode 100644
index 75c5a22..0000000
--- a/next.config.ts
+++ /dev/null
@@ -1,31 +0,0 @@
-import type { NextConfig } from "next";
-
-const nextConfig: NextConfig = {
-  /* config options here */
-  // 设置需要转译的包
-  transpilePackages: ['swagger-ui-react'],
-  
-  // 配置实验性选项
-  experimental: {
-    // 禁用外部目录处理，避免monorepo问题
-    // externalDir: true,
-  },
-  
-  // 禁用严格模式，避免开发时重复渲染
-  reactStrictMode: false,
-  
-  // 暂时禁用standalone输出模式，解决构建问题
-  // output: 'standalone',
-  
-  // 忽略ESLint错误，不会在构建时中断
-  eslint: {
-    ignoreDuringBuilds: true,
-  },
-  
-  // 忽略TypeScript错误，不会在构建时中断
-  typescript: {
-    ignoreBuildErrors: true,
-  },
-}
-
-export default nextConfig;
diff --git a/tailwind.config.ts b/tailwind.config.ts
index dca00d8..a88f667 100644
--- a/tailwind.config.ts
+++ b/tailwind.config.ts
@@ -6,6 +6,7 @@ const config: Config = {
     "./components/**/*.{js,ts,jsx,tsx,mdx}",
     "./app/**/*.{js,ts,jsx,tsx,mdx}",
   ],
+  darkMode: "class",
   theme: {
     extend: {
       colors: {