diff --git a/CHANGELOG.md b/CHANGELOG.md
index 38c2506f11da..140bc1263e0f 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,23 @@
 
 # Changelog
 
+### [Version 1.22.18](https://github.com/lobehub/lobe-chat/compare/v1.22.17...v1.22.18)
+
+<sup>Released on **2024-10-22**</sup>
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.22.17](https://github.com/lobehub/lobe-chat/compare/v1.22.16...v1.22.17)
 
 <sup>Released on **2024-10-22**</sup>
diff --git a/package.json b/package.json
index 347d3e983a4e..df42b848ea05 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.22.17",
+  "version": "1.22.18",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",
@@ -284,6 +284,7 @@
     "lodash": "^4.17.21",
     "markdown-table": "^3.0.3",
     "node-fetch": "^3.3.2",
+    "node-gyp": "^10.2.0",
     "openapi-typescript": "^6.7.6",
     "p-map": "^7.0.2",
     "prettier": "^3.3.3",
diff --git a/src/layout/GlobalProvider/AppTheme.tsx b/src/layout/GlobalProvider/AppTheme.tsx
index 7b3da5a7e0f2..9787803380e8 100644
--- a/src/layout/GlobalProvider/AppTheme.tsx
+++ b/src/layout/GlobalProvider/AppTheme.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { ConfigProvider, NeutralColors, PrimaryColors, ThemeProvider } from '@lobehub/ui';
+import { ConfigProvider as AntdConfigProvider } from 'antd';
 import { ThemeAppearance, createStyles } from 'antd-style';
 import 'antd/dist/reset.css';
 import Image from 'next/image';
@@ -103,31 +104,33 @@ const AppTheme = memo<AppThemeProps>(
     }, [neutralColor]);
 
     return (
-      <ThemeProvider
-        className={cx(styles.app, styles.scrollbar, styles.scrollbarPolyfill)}
-        customTheme={{
-          neutralColor: neutralColor ?? defaultNeutralColor,
-          primaryColor: primaryColor ?? defaultPrimaryColor,
-        }}
-        defaultAppearance={defaultAppearance}
-        onAppearanceChange={(appearance) => {
-          setCookie(LOBE_THEME_APPEARANCE, appearance);
-        }}
-        themeMode={themeMode}
-      >
-        <GlobalStyle />
-        <AntdStaticMethods />
-        <ConfigProvider
-          config={{
-            aAs: Link,
-            imgAs: Image,
-            imgUnoptimized: true,
-            proxy: globalCDN ? 'unpkg' : undefined,
+      <AntdConfigProvider theme={{ cssVar: true }}>
+        <ThemeProvider
+          className={cx(styles.app, styles.scrollbar, styles.scrollbarPolyfill)}
+          customTheme={{
+            neutralColor: neutralColor ?? defaultNeutralColor,
+            primaryColor: primaryColor ?? defaultPrimaryColor,
           }}
+          defaultAppearance={defaultAppearance}
+          onAppearanceChange={(appearance) => {
+            setCookie(LOBE_THEME_APPEARANCE, appearance);
+          }}
+          themeMode={themeMode}
         >
-          {children}
-        </ConfigProvider>
-      </ThemeProvider>
+          <GlobalStyle />
+          <AntdStaticMethods />
+          <ConfigProvider
+            config={{
+              aAs: Link,
+              imgAs: Image,
+              imgUnoptimized: true,
+              proxy: globalCDN ? 'unpkg' : undefined,
+            }}
+          >
+            {children}
+          </ConfigProvider>
+        </ThemeProvider>
+      </AntdConfigProvider>
     );
   },
 );