diff --git a/client/web/jest.config.js b/client/web/jest.config.js
index 8095289e..267eb97a 100644
--- a/client/web/jest.config.js
+++ b/client/web/jest.config.js
@@ -2,6 +2,36 @@ const regeneratorRuntime = require('regenerator-runtime');
 const { pathsToModuleNameMapper } = require('ts-jest');
 const webCompilerOptions = require('./tsconfig.test.json').compilerOptions;
 
+// 用于处理编译出来是esmodule会抛出 SyntaxError: Unexpected token 'export' 问题的包
+const esModules = [
+  'react-markdown',
+  'vfile',
+  'unist-util-stringify-position',
+  'unified',
+  'bail',
+  'is-plain-obj',
+  'trough',
+  'remark-parse',
+  'mdast-util-from-markdown',
+  'mdast-util-to-string',
+  'micromark',
+  'decode-named-character-reference',
+  'character-entities',
+  'remark-rehype',
+  'mdast-util-to-hast',
+  'unist-builder',
+  'unist-util-visit',
+  'unist-util-is',
+  'unist-util-position',
+  'unist-util-generated',
+  'mdast-util-definitions',
+  'trim-lines',
+  'property-information',
+  'hast-util-whitespace',
+  'space-separated-tokens',
+  'comma-separated-tokens',
+].join('|');
+
 /** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
 module.exports = {
   preset: 'ts-jest',
@@ -19,8 +49,9 @@ module.exports = {
   transform: {
     '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
       '<rootDir>/test/fileTransformer.js',
+    [`(${esModules}).+\\.(j|t)sx?$`]: 'ts-jest',
   },
-  transformIgnorePatterns: ['/node_modules/'],
+  transformIgnorePatterns: [`/node_modules/\.pnpm/(?!(${esModules}))`],
   setupFiles: ['<rootDir>/test/setup.js'],
   setupFilesAfterEnv: [],
   globals: {
diff --git a/client/web/src/components/__tests__/__snapshots__/Markdown.spec.tsx.snap b/client/web/src/components/__tests__/__snapshots__/Markdown.spec.tsx.snap
index 3c1a4942..008509ee 100644
--- a/client/web/src/components/__tests__/__snapshots__/Markdown.spec.tsx.snap
+++ b/client/web/src/components/__tests__/__snapshots__/Markdown.spec.tsx.snap
@@ -52,10 +52,43 @@ exports[`Markdown link with baseUrl 1`] = `
       </a>
       
 
-      <img
-        alt=""
-        src="https://tailchat.msgbyte.com/demo.jpg"
-      />
+      <div
+        class="ant-image"
+      >
+        <img
+          class="ant-image-img"
+          loading="lazy"
+          src="https://tailchat.msgbyte.com/demo.jpg"
+        />
+        <div
+          class="ant-image-mask"
+        >
+          <div
+            class="ant-image-mask-info"
+          >
+            <span
+              aria-label="eye"
+              class="anticon anticon-eye"
+              role="img"
+            >
+              <svg
+                aria-hidden="true"
+                data-icon="eye"
+                fill="currentColor"
+                focusable="false"
+                height="1em"
+                viewBox="64 64 896 896"
+                width="1em"
+              >
+                <path
+                  d="M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z"
+                />
+              </svg>
+            </span>
+            Preview
+          </div>
+        </div>
+      </div>
     </p>
   </div>
 </div>
@@ -81,10 +114,43 @@ exports[`Markdown link without baseUrl 1`] = `
       </a>
       
 
-      <img
-        alt=""
-        src="./demo.jpg"
-      />
+      <div
+        class="ant-image"
+      >
+        <img
+          class="ant-image-img"
+          loading="lazy"
+          src="./demo.jpg"
+        />
+        <div
+          class="ant-image-mask"
+        >
+          <div
+            class="ant-image-mask-info"
+          >
+            <span
+              aria-label="eye"
+              class="anticon anticon-eye"
+              role="img"
+            >
+              <svg
+                aria-hidden="true"
+                data-icon="eye"
+                fill="currentColor"
+                focusable="false"
+                height="1em"
+                viewBox="64 64 896 896"
+                width="1em"
+              >
+                <path
+                  d="M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z"
+                />
+              </svg>
+            </span>
+            Preview
+          </div>
+        </div>
+      </div>
     </p>
   </div>
 </div>
diff --git a/client/web/tsconfig.test.json b/client/web/tsconfig.test.json
index 4f7b0369..62427d3b 100644
--- a/client/web/tsconfig.test.json
+++ b/client/web/tsconfig.test.json
@@ -1,6 +1,7 @@
 {
   "extends": "./tsconfig.json",
   "compilerOptions": {
+    "allowJs": true,
     "paths": {
       "@/*": ["./src/*"],
       "@test/*": ["./test/*"],