diff --git a/examples/webpack-demo/package.json b/examples/webpack-demo/package.json
index 3afe71cd..f39ea805 100644
--- a/examples/webpack-demo/package.json
+++ b/examples/webpack-demo/package.json
@@ -12,8 +12,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-config": "^5.1.1",
-    "react-router-dom": "^6.22.3",
-    "shiki": "^1.1.7"
+    "react-router-dom": "^6.22.3"
   },
   "devDependencies": {
     "@babel/core": "^7.24.0",
diff --git a/packages/canyon-platform/package.json b/packages/canyon-platform/package.json
index 5b4e41ac..9c01bcd7 100644
--- a/packages/canyon-platform/package.json
+++ b/packages/canyon-platform/package.json
@@ -35,7 +35,6 @@
     "react-dom": "^18.3.1",
     "react-highlight-words": "^0.20.0",
     "react-i18next": "^14.1.2",
-    "shiki": "^1.10.3",
     "react-router-dom": "^6.24.0"
   },
   "devDependencies": {
@@ -48,8 +47,6 @@
     "@typescript-eslint/parser": "^7.16.0",
     "@vitejs/plugin-react-swc": "^3.7.0",
     "autoprefixer": "^10.4.19",
-    "babel-plugin-canyon": "^1.8.46",
-    "babel-plugin-istanbul": "^7.0.0",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.29.1",
diff --git a/packages/canyon-platform/src/components/CanyonReport/CoverageDetail.tsx b/packages/canyon-platform/src/components/CanyonReport/CoverageDetail.tsx
index abc61f0a..4bad43b7 100644
--- a/packages/canyon-platform/src/components/CanyonReport/CoverageDetail.tsx
+++ b/packages/canyon-platform/src/components/CanyonReport/CoverageDetail.tsx
@@ -1,4 +1,3 @@
-import { getViewLineHeight } from '../../helpers/utils/getViewLineHeight.tsx';
 import { coreFn } from './helper.tsx';
 import LineCoverage from './line/coverage.tsx';
 import LineNew from './line/new.tsx';
@@ -6,7 +5,6 @@ import LineNumber from './line/number.tsx';
 import ShikiDetail from './ShikiDetail.tsx';
 
 const CanyonReportCoverageDetail = ({ data, theme }: any) => {
-  const viewLineHeight = getViewLineHeight();
   const code = data.sourcecode;
   const { lines } = coreFn(data.coverage, code);
   return (
@@ -16,8 +14,7 @@ const CanyonReportCoverageDetail = ({ data, theme }: any) => {
         style={{
           display: 'flex',
           fontSize: '12px',
-          lineHeight: '14px',
-          visibility: viewLineHeight > 0 ? 'visible' : 'hidden',
+          lineHeight: '14px'
           // backgroundColor: theme === 'dark' ? '#1a1b26' : 'white',
         }}
       >
@@ -46,7 +43,6 @@ const CanyonReportCoverageDetail = ({ data, theme }: any) => {
         />
         <ShikiDetail defaultValue={data?.sourcecode} filecoverage={data.coverage} theme={theme} />
       </div>
-      {viewLineHeight === 0 && <Spin spinning={viewLineHeight === 0} />}
     </>
   );
 };
diff --git a/packages/canyon-platform/src/components/CanyonReport/ShikiDetail.tsx b/packages/canyon-platform/src/components/CanyonReport/ShikiDetail.tsx
index faae4fd3..6d9e265e 100644
--- a/packages/canyon-platform/src/components/CanyonReport/ShikiDetail.tsx
+++ b/packages/canyon-platform/src/components/CanyonReport/ShikiDetail.tsx
@@ -1,4 +1,4 @@
-import { codeToHtml } from 'shiki';
+import { codeToHtml } from 'https://esm.sh/shiki@1.0.0';
 
 import { mergeIntervals } from './helper.tsx';
 
@@ -104,12 +104,12 @@ const ShikiDetail = ({ defaultValue, filecoverage, theme }) => {
     })
     .catch(() => {
       console.log('覆盖率着色失败');
-      codeToHtml(defaultValue, {
-        lang: 'javascript',
-        theme: theme === 'light' ? 'light-plus' : 'tokyo-night',
-      }).then((r) => {
-        setContent(r);
-      });
+      // codeToHtml(defaultValue, {
+      //   lang: 'javascript',
+      //   theme: theme === 'light' ? 'light-plus' : 'tokyo-night',
+      // }).then((r) => {
+      //   setContent(r);
+      // });
     });
   return (
     <div className={'px-[12px] overflow-x-auto w-full'}>
diff --git a/packages/canyon-platform/src/components/app/CopyCode.tsx b/packages/canyon-platform/src/components/app/CopyCode.tsx
index 8fccf7d5..64f3a435 100755
--- a/packages/canyon-platform/src/components/app/CopyCode.tsx
+++ b/packages/canyon-platform/src/components/app/CopyCode.tsx
@@ -1,10 +1,10 @@
 import './CopyCode.css';
 
 import { CopyOutlined } from '@ant-design/icons';
+import { codeToHtml } from 'https://esm.sh/shiki@1.0.0';
 import { FC, useEffect } from 'react';
 // @ts-ignore
 import { CopyToClipboard } from 'react-copy-to-clipboard';
-import { codeToHtml } from 'shiki';
 
 const CopyCode: FC<{ code: string }> = ({ code }) => {
   const fileContent = code;
diff --git a/packages/canyon-platform/src/helpers/utils/getViewLineHeight.tsx b/packages/canyon-platform/src/helpers/utils/getViewLineHeight.tsx
index e718da74..07ad11f7 100644
--- a/packages/canyon-platform/src/helpers/utils/getViewLineHeight.tsx
+++ b/packages/canyon-platform/src/helpers/utils/getViewLineHeight.tsx
@@ -1,18 +1,3 @@
 export const getViewLineHeight = () => {
-  const [hight, setHight] = useState(0);
-  useEffect(() => {
-    let count = 0;
-    const timer = setInterval(() => {
-      count++;
-      // const h = (document.querySelector('.line') as HTMLElement)?.offsetHeight || 0;
-      const h = 20;
-      if (h > 0 || count > 50) {
-        // 超过30秒还没获取到高度，就不再获取
-        setHight(h);
-        clearInterval(timer);
-      }
-    }, 60);
-  }, []);
-
-  return hight;
+  return 20;
 };