diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts
index 30254dd..b3cf4a1 100644
--- a/docs/.vitepress/config.mts
+++ b/docs/.vitepress/config.mts
@@ -24,8 +24,8 @@ export default defineConfig({
         'edit-on-github': '在 Github 中编辑',
         'copy-code': '复制代码',
         'copy-success': '复制成功',
-        'copy-error': '复制失败'
-      }
+        'copy-error': '复制失败',
+      },
     },
 
     // https://vitepress.dev/reference/default-theme-config
@@ -51,10 +51,17 @@ export default defineConfig({
   markdown: {
     config: (md) => {
       md.use(demoblockPlugin)
-    }
+    },
   },
   vite: {
-    plugins: [demoblockVitePlugin()]
+
+    resolve: {
+      alias: {
+        '@': new URL('../../package', import.meta.url).pathname,
+      },
+      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.less'],
+    },
+    plugins: [demoblockVitePlugin()],
   },
-  vue: {}
+  vue: {},
 })
diff --git a/docs/guide/quick-start.md b/docs/guide/quick-start.md
new file mode 100644
index 0000000..ae99fff
--- /dev/null
+++ b/docs/guide/quick-start.md
@@ -0,0 +1,46 @@
+---
+outline: deep
+---
+
+## Installation
+
+```shell
+npm i vue3-styled-components
+```
+
+```shell
+yarn add vue3-styled-components
+```
+
+```shell
+pnpm i vue3-styled-components
+```
+
+## Getting Started
+
+:::demo
+
+```vue
+
+<script setup lang="ts">
+  import { styled } from '@vue3-styled-components/package'
+
+  const StyledDiv = styled.div`
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 20px;
+    border-radius: 9999px;
+    background-color: #4c5a6d;
+    font-size: 20px;
+    font-weight: bold;
+    color: #fff;
+  `
+</script>
+
+<template>
+  <StyledDiv>Hello World!</StyledDiv>
+</template>
+```
+
+:::
\ No newline at end of file
diff --git a/docs/package.json b/docs/package.json
index e056e9d..9a2ad10 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -15,5 +15,8 @@
   "devDependencies": {
     "vitepress": "^1.0.2",
     "vitepress-theme-demoblock": "^3.0.7"
+  },
+  "dependencies": {
+    "@vue3-styled-components/package": "workspace:^"
   }
 }
\ No newline at end of file
diff --git a/package.json b/package.json
index db9783d..39e35ee 100644
--- a/package.json
+++ b/package.json
@@ -9,6 +9,7 @@
   ],
   "scripts": {
     "dev": "cd example && pnpm run dev",
+    "docs:dev": "cd docs && pnpm run docs:dev",
     "typecheck": "vue-tsc --noEmit",
     "lint": "eslint . -c .eslintrc.json --fix --ext .ts,.vue,.tsx,.d.ts",
     "prepare": "husky install"
diff --git a/package/package.json b/package/package.json
index 9b14625..6c9081b 100644
--- a/package/package.json
+++ b/package/package.json
@@ -3,5 +3,6 @@
   "version": "0.0.2",
   "description": "",
   "type": "module",
+  "main": "index.ts",
   "scripts": {}
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c8307f4..d01df6d 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -62,6 +62,10 @@ importers:
         version: 2.0.7(typescript@5.4.3)
 
   docs:
+    dependencies:
+      '@vue3-styled-components/package':
+        specifier: workspace:^
+        version: link:../package
     devDependencies:
       vitepress:
         specifier: ^1.0.2