diff --git a/config/config.e2e.ts b/config/config.e2e.ts
index 18b4ca6f..9cb6336a 100644
--- a/config/config.e2e.ts
+++ b/config/config.e2e.ts
@@ -12,6 +12,6 @@ export default defineConfig({
     dynamicRoot: true,
   },
   alias: {
-    '@e2e-utils': resolve(__dirname, '../docs/__utils__'),
+    '@docs-utils': resolve(__dirname, '../docs/__utils__'),
   },
 });
diff --git a/config/config.ts b/config/config.ts
index 1398531a..48646bca 100644
--- a/config/config.ts
+++ b/config/config.ts
@@ -32,7 +32,10 @@ export default defineConfig({
     loading: '@ant-design/pro-skeleton',
   },
   alias: {
-    '@e2e-utils': resolve(__dirname, '../docs/__utils__'),
+    '@docs-utils': resolve(__dirname, '../docs/__utils__'),
   },
   hash: true,
+  theme: {
+    '@c-primary': '#ff9800',
+  },
 });
diff --git a/docs/e2e/basic/demos/BackgroundImage/InlinePng.tsx b/docs/e2e/basic/demos/BackgroundImage/InlinePng.tsx
index 68302ed3..52755795 100644
--- a/docs/e2e/basic/demos/BackgroundImage/InlinePng.tsx
+++ b/docs/e2e/basic/demos/BackgroundImage/InlinePng.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 // @ts-ignore
 import styles from './Inline.less';
 
diff --git a/docs/e2e/basic/demos/BackgroundImage/InlineSvg.tsx b/docs/e2e/basic/demos/BackgroundImage/InlineSvg.tsx
index 7d0217fe..2b815eaa 100644
--- a/docs/e2e/basic/demos/BackgroundImage/InlineSvg.tsx
+++ b/docs/e2e/basic/demos/BackgroundImage/InlineSvg.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 // @ts-ignore
 import styles from './Inline.less';
 
diff --git a/docs/e2e/basic/demos/BackgroundImage/WithSize.tsx b/docs/e2e/basic/demos/BackgroundImage/WithSize.tsx
index 93d886d6..b376cb2b 100644
--- a/docs/e2e/basic/demos/BackgroundImage/WithSize.tsx
+++ b/docs/e2e/basic/demos/BackgroundImage/WithSize.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/BackgroundImage/WithoutSize.tsx b/docs/e2e/basic/demos/BackgroundImage/WithoutSize.tsx
index c0873fe4..2fad9de3 100644
--- a/docs/e2e/basic/demos/BackgroundImage/WithoutSize.tsx
+++ b/docs/e2e/basic/demos/BackgroundImage/WithoutSize.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/CanvasBasic.tsx b/docs/e2e/basic/demos/CanvasBasic.tsx
index 5ae93585..7d0f4dd7 100644
--- a/docs/e2e/basic/demos/CanvasBasic.tsx
+++ b/docs/e2e/basic/demos/CanvasBasic.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Line } from '@ant-design/charts';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 const data = [
   {
diff --git a/docs/e2e/basic/demos/CanvasCors.tsx b/docs/e2e/basic/demos/CanvasCors.tsx
index 6c3e7aca..2a21c107 100644
--- a/docs/e2e/basic/demos/CanvasCors.tsx
+++ b/docs/e2e/basic/demos/CanvasCors.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Checkbox.tsx b/docs/e2e/basic/demos/Checkbox.tsx
index 3b27bd2f..cc27b305 100644
--- a/docs/e2e/basic/demos/Checkbox.tsx
+++ b/docs/e2e/basic/demos/Checkbox.tsx
@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import { Checkbox } from 'antd';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 const SwitchDemo: FC = () => {
   const { elements, ref } = useElements();
diff --git a/docs/e2e/basic/demos/Image/ImageInline.tsx b/docs/e2e/basic/demos/Image/ImageInline.tsx
index 907aefee..efe2e589 100644
--- a/docs/e2e/basic/demos/Image/ImageInline.tsx
+++ b/docs/e2e/basic/demos/Image/ImageInline.tsx
@@ -1,5 +1,5 @@
 import React, { useRef } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import copy from 'copy-to-clipboard';
 import { message } from 'antd';
 
diff --git a/docs/e2e/basic/demos/Image/ImageNoProtocol.tsx b/docs/e2e/basic/demos/Image/ImageNoProtocol.tsx
index c3cc745b..e8696874 100644
--- a/docs/e2e/basic/demos/Image/ImageNoProtocol.tsx
+++ b/docs/e2e/basic/demos/Image/ImageNoProtocol.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Image/ImagePng.tsx b/docs/e2e/basic/demos/Image/ImagePng.tsx
index 47dbdb59..cfde639e 100644
--- a/docs/e2e/basic/demos/Image/ImagePng.tsx
+++ b/docs/e2e/basic/demos/Image/ImagePng.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Image/ImageSvg.tsx b/docs/e2e/basic/demos/Image/ImageSvg.tsx
index c024774b..3f25511f 100644
--- a/docs/e2e/basic/demos/Image/ImageSvg.tsx
+++ b/docs/e2e/basic/demos/Image/ImageSvg.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Image/TwoInlineImage.tsx b/docs/e2e/basic/demos/Image/TwoInlineImage.tsx
index f09c72b2..43539950 100644
--- a/docs/e2e/basic/demos/Image/TwoInlineImage.tsx
+++ b/docs/e2e/basic/demos/Image/TwoInlineImage.tsx
@@ -1,5 +1,5 @@
 import React, { useRef } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Radio.tsx b/docs/e2e/basic/demos/Radio.tsx
index b05ef6d6..bbaa846c 100644
--- a/docs/e2e/basic/demos/Radio.tsx
+++ b/docs/e2e/basic/demos/Radio.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Radio } from 'antd';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Select.tsx b/docs/e2e/basic/demos/Select.tsx
index d308343f..68f71a89 100644
--- a/docs/e2e/basic/demos/Select.tsx
+++ b/docs/e2e/basic/demos/Select.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import { Select } from 'antd';
 
 const { Option } = Select;
diff --git a/docs/e2e/basic/demos/Switch.tsx b/docs/e2e/basic/demos/Switch.tsx
index 8c17c3f1..4c0439ce 100644
--- a/docs/e2e/basic/demos/Switch.tsx
+++ b/docs/e2e/basic/demos/Switch.tsx
@@ -1,6 +1,6 @@
 import React, { FC } from 'react';
 import { Switch, Space } from 'antd';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 const SwitchDemo: FC = () => {
   const { elements, ref } = useElements();
diff --git a/docs/e2e/basic/demos/Text/BlockAlign.tsx b/docs/e2e/basic/demos/Text/BlockAlign.tsx
index 7acf6d8d..4b7e8b21 100644
--- a/docs/e2e/basic/demos/Text/BlockAlign.tsx
+++ b/docs/e2e/basic/demos/Text/BlockAlign.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import './Text.less';
 
 /**
diff --git a/docs/e2e/basic/demos/Text/Ellipsis.tsx b/docs/e2e/basic/demos/Text/Ellipsis.tsx
index edadf5ab..4fae92a4 100644
--- a/docs/e2e/basic/demos/Text/Ellipsis.tsx
+++ b/docs/e2e/basic/demos/Text/Ellipsis.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Text/FlexAlign.tsx b/docs/e2e/basic/demos/Text/FlexAlign.tsx
index a71d40a3..44c76ab5 100644
--- a/docs/e2e/basic/demos/Text/FlexAlign.tsx
+++ b/docs/e2e/basic/demos/Text/FlexAlign.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import './Text.less';
 
 /**
diff --git a/docs/e2e/basic/demos/Text/Input.tsx b/docs/e2e/basic/demos/Text/Input.tsx
index d48ee529..d9b35e7f 100644
--- a/docs/e2e/basic/demos/Text/Input.tsx
+++ b/docs/e2e/basic/demos/Text/Input.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import { Input } from 'antd';
 
 /**
diff --git a/docs/e2e/basic/demos/Text/InputAligin.tsx b/docs/e2e/basic/demos/Text/InputAligin.tsx
index 6369b04e..91366adf 100644
--- a/docs/e2e/basic/demos/Text/InputAligin.tsx
+++ b/docs/e2e/basic/demos/Text/InputAligin.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 export default () => {
   const { elements, ref } = useElements();
diff --git a/docs/e2e/basic/demos/Text/Label.tsx b/docs/e2e/basic/demos/Text/Label.tsx
index f843ec33..4943ac0f 100644
--- a/docs/e2e/basic/demos/Text/Label.tsx
+++ b/docs/e2e/basic/demos/Text/Label.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import './Text.less';
 
 /**
diff --git a/docs/e2e/basic/demos/Text/MutliLine.tsx b/docs/e2e/basic/demos/Text/MutliLine.tsx
index e89e5fe0..04c49a73 100644
--- a/docs/e2e/basic/demos/Text/MutliLine.tsx
+++ b/docs/e2e/basic/demos/Text/MutliLine.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Text/Span.tsx b/docs/e2e/basic/demos/Text/Span.tsx
index 96b8a95b..de99ffd5 100644
--- a/docs/e2e/basic/demos/Text/Span.tsx
+++ b/docs/e2e/basic/demos/Text/Span.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Text/SpanIcon.tsx b/docs/e2e/basic/demos/Text/SpanIcon.tsx
index 70daf8fa..3c559fe3 100644
--- a/docs/e2e/basic/demos/Text/SpanIcon.tsx
+++ b/docs/e2e/basic/demos/Text/SpanIcon.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import { AppleOutlined } from '@ant-design/icons';
 
 /**
diff --git a/docs/e2e/basic/demos/Text/SpanInlineBlock.tsx b/docs/e2e/basic/demos/Text/SpanInlineBlock.tsx
index 619c638e..8b23c1df 100644
--- a/docs/e2e/basic/demos/Text/SpanInlineBlock.tsx
+++ b/docs/e2e/basic/demos/Text/SpanInlineBlock.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import './Text.less';
 /**
  *
diff --git a/docs/e2e/basic/demos/Text/SpanLinkRow.tsx b/docs/e2e/basic/demos/Text/SpanLinkRow.tsx
index 4e116108..6e4587f8 100644
--- a/docs/e2e/basic/demos/Text/SpanLinkRow.tsx
+++ b/docs/e2e/basic/demos/Text/SpanLinkRow.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/basic/demos/Text/TagInlineBlock.tsx b/docs/e2e/basic/demos/Text/TagInlineBlock.tsx
index ca23ecaa..8ee3a2bc 100644
--- a/docs/e2e/basic/demos/Text/TagInlineBlock.tsx
+++ b/docs/e2e/basic/demos/Text/TagInlineBlock.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/components/demos/DefaultModal.tsx b/docs/e2e/components/demos/DefaultModal.tsx
index f678a142..3b865c66 100644
--- a/docs/e2e/components/demos/DefaultModal.tsx
+++ b/docs/e2e/components/demos/DefaultModal.tsx
@@ -1,6 +1,6 @@
 import React, { FC, useEffect } from 'react';
 import { Modal } from 'antd';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 // @ts-ignore
 import styles from './Modal.less';
 
diff --git a/docs/e2e/components/demos/Table.tsx b/docs/e2e/components/demos/Table.tsx
index a66392bc..26cc9fbc 100644
--- a/docs/e2e/components/demos/Table.tsx
+++ b/docs/e2e/components/demos/Table.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import { Tag } from 'antd';
 import ProTable from '@ant-design/pro-table';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 const dataSource = [
   {
diff --git a/docs/e2e/components/demos/Tabs.tsx b/docs/e2e/components/demos/Tabs.tsx
index b4ec3b2c..1889fc54 100644
--- a/docs/e2e/components/demos/Tabs.tsx
+++ b/docs/e2e/components/demos/Tabs.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import { Tabs } from 'antd';
 import { AppleOutlined, AndroidOutlined } from '@ant-design/icons';
 
diff --git a/docs/e2e/index.md b/docs/e2e/index.md
index 046d6c42..c1cc6f52 100644
--- a/docs/e2e/index.md
+++ b/docs/e2e/index.md
@@ -16,8 +16,8 @@ nav:
 
 演示: ![demo](https://gw.alipayobjects.com/zos/antfincdn/TrL5ejOKSE/demo.gif)
 
-### @e2e-layout
+### @docs-utils
 
-用例代码显示上并不包括 `@e2e-layout` 的代码
+用例代码显示上并不包括 `@docs-utils` 的代码
 
-如果需要查看 `@e2e-layout` 的代码, 请到 `docs/__utils__` 文件夹 [查看](https://github.com/ant-design/html2sketch/tree/master/docs/__utils__)
+如果需要查看 `@docs-utils` 的代码, 请到 `docs/__utils__` 文件夹 [查看](https://github.com/ant-design/html2sketch/tree/master/docs/__utils__)
diff --git a/docs/e2e/styles/demos/LineGradient.tsx b/docs/e2e/styles/demos/LineGradient.tsx
index 53ed0f0e..1d928049 100644
--- a/docs/e2e/styles/demos/LineGradient.tsx
+++ b/docs/e2e/styles/demos/LineGradient.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  *
diff --git a/docs/e2e/svg/demos/Icons.tsx b/docs/e2e/svg/demos/Icons.tsx
index 95c6419c..be1f9fc2 100644
--- a/docs/e2e/svg/demos/Icons.tsx
+++ b/docs/e2e/svg/demos/Icons.tsx
@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 import { DropboxOutlined, BehanceOutlined } from '@ant-design/icons';
 
 const SvgIcons: FC = () => {
diff --git a/docs/e2e/svg/demos/SvgGroup.tsx b/docs/e2e/svg/demos/SvgGroup.tsx
index 23cb76b4..f46d9a5a 100644
--- a/docs/e2e/svg/demos/SvgGroup.tsx
+++ b/docs/e2e/svg/demos/SvgGroup.tsx
@@ -1,7 +1,7 @@
 import React, { FC } from 'react';
 import { Button } from 'antd';
 import { UpCircleOutlined } from '@ant-design/icons';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  * Button demos
diff --git a/docs/e2e/svg/demos/SvgIllustration.tsx b/docs/e2e/svg/demos/SvgIllustration.tsx
index 94eeb399..6b502a60 100644
--- a/docs/e2e/svg/demos/SvgIllustration.tsx
+++ b/docs/e2e/svg/demos/SvgIllustration.tsx
@@ -2,7 +2,7 @@ import React, { FC } from 'react';
 // @ts-ignore
 import { ReactComponent as Svg } from './svg/illustration.svg';
 
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 /**
  * 插画解析 demos
diff --git a/docs/e2e/svg/demos/SvgMutliPath.tsx b/docs/e2e/svg/demos/SvgMutliPath.tsx
index 00b6fc3a..2bc05a3a 100644
--- a/docs/e2e/svg/demos/SvgMutliPath.tsx
+++ b/docs/e2e/svg/demos/SvgMutliPath.tsx
@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { TestLayout, useElements } from '@e2e-utils';
+import { TestLayout, useElements } from '@docs-utils';
 import { PlusOutlined } from '@ant-design/icons';
 
 const IconTest: FC = () => {
diff --git a/docs/e2e/svg/demos/SvgPathGroup.tsx b/docs/e2e/svg/demos/SvgPathGroup.tsx
index c4261479..d07bea8d 100644
--- a/docs/e2e/svg/demos/SvgPathGroup.tsx
+++ b/docs/e2e/svg/demos/SvgPathGroup.tsx
@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { TestLayout, useElements } from '@e2e-utils';
+import { TestLayout, useElements } from '@docs-utils';
 import { UpCircleOutlined } from '@ant-design/icons';
 
 const IconTest: FC = () => {
diff --git a/docs/e2e/svg/demos/SvgSimpleIllustration.tsx b/docs/e2e/svg/demos/SvgSimpleIllustration.tsx
index dce1b5c0..ace4df3d 100644
--- a/docs/e2e/svg/demos/SvgSimpleIllustration.tsx
+++ b/docs/e2e/svg/demos/SvgSimpleIllustration.tsx
@@ -1,6 +1,6 @@
 /* eslint-disable */
 import React, { FC } from 'react';
-import { TestLayout, useElements } from '@e2e-utils';
+import { TestLayout, useElements } from '@docs-utils';
 
 const IconTest: FC = () => {
   const { elements, ref } = useElements();
diff --git a/docs/e2e/svg/demos/SvgTest.tsx b/docs/e2e/svg/demos/SvgTest.tsx
index cd7a8524..f6c6cbc9 100644
--- a/docs/e2e/svg/demos/SvgTest.tsx
+++ b/docs/e2e/svg/demos/SvgTest.tsx
@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 // @ts-ignore
 import { ReactComponent as Svg } from './svg/test.svg';
 
diff --git a/docs/e2e/svg/demos/SvgText.tsx b/docs/e2e/svg/demos/SvgText.tsx
index b31a7cc6..7455f398 100644
--- a/docs/e2e/svg/demos/SvgText.tsx
+++ b/docs/e2e/svg/demos/SvgText.tsx
@@ -1,5 +1,5 @@
 import React, { FC } from 'react';
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 // @ts-ignore
 import { ReactComponent as Svg } from './svg/text.svg';
 
diff --git a/docs/e2e/svg/demos/SvgUseSymbol.tsx b/docs/e2e/svg/demos/SvgUseSymbol.tsx
index bbe5d620..79194094 100644
--- a/docs/e2e/svg/demos/SvgUseSymbol.tsx
+++ b/docs/e2e/svg/demos/SvgUseSymbol.tsx
@@ -4,7 +4,7 @@ import { ReactComponent as SvgLink } from './svg/symbolLink.svg';
 // @ts-ignore
 import { ReactComponent as Svg } from './svg/useSymbol.svg';
 
-import { useElements, TestLayout } from '@e2e-utils';
+import { useElements, TestLayout } from '@docs-utils';
 
 const SvgIcons: FC = () => {
   const { elements, ref } = useElements();
diff --git a/e2e/__tests__/basic/image.e2e.ts b/e2e/__tests__/basic/image.e2e.ts
index 6e174025..763f8195 100644
--- a/e2e/__tests__/basic/image.e2e.ts
+++ b/e2e/__tests__/basic/image.e2e.ts
@@ -4,7 +4,7 @@ import {
   outputJSONData,
   pngURLImageJSON,
   inlineImageJSON,
-} from '@e2e';
+} from '@e2e-utils';
 
 describe('测试图片', () => {
   test('inline 的图片类型正常', async () => {
diff --git a/e2e/__tests__/components/modal.e2e.ts b/e2e/__tests__/components/modal.e2e.ts
index e8d322c5..ff08fb13 100644
--- a/e2e/__tests__/components/modal.e2e.ts
+++ b/e2e/__tests__/components/modal.e2e.ts
@@ -1,5 +1,5 @@
 import SketchFormat from '@sketch-hq/sketch-file-format-ts';
-import { initHtml2Sketch, isUpdate, outputJSONData } from '@e2e';
+import { initHtml2Sketch, isUpdate, outputJSONData } from '@e2e-utils';
 
 describe('测试 Modal 类型', () => {
   test('Modal 正常', async () => {
diff --git a/e2e/__tests__/svg/icon.e2e.ts b/e2e/__tests__/svg/icon.e2e.ts
index 3a430472..134c580d 100644
--- a/e2e/__tests__/svg/icon.e2e.ts
+++ b/e2e/__tests__/svg/icon.e2e.ts
@@ -4,7 +4,7 @@ import {
   outputJSONData,
   svgButtonJSON,
   svgIconJSON,
-} from '@e2e';
+} from '@e2e-utils';
 
 describe('测试 Svg Icon', () => {
   test('Svg icon', async () => {