diff --git a/.gitignore b/.gitignore
index 2dde5ab..5768012 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
 
 dist
 node_modules
+.httpserver
 
 *.sublime-project
 *.sublime-workspace
diff --git a/vue.live.js b/fite.config.js
similarity index 66%
rename from vue.live.js
rename to fite.config.js
index 9c8401e..79aec3d 100644
--- a/vue.live.js
+++ b/fite.config.js
@@ -16,6 +16,14 @@ export default {
       entry: resolve('./src/pages/index/main.js'),
       title: 'home page'
     },
+    '@wcui/index': {
+      entry: resolve('./src/pages/@wcui/index/main.js'),
+      title: 'home page'
+    },
+    '@wcui/docs': {
+      entry: resolve('./src/pages/@wcui/docs/main.js'),
+      title: 'home page'
+    },
     playground: {
       entry: resolve('./src/pages/playground/main.js'),
       title: '@bd/ui Playground'
@@ -26,6 +34,8 @@ export default {
     vue: '//jscdn.ink/vue/3.2.47/vue.runtime.esm-browser.prod.js',
     'vue-router': '//jscdn.ink/@bytedo/vue-router/4.1.6/vue-router.js',
     fetch: '//jscdn.ink/@bytedo/fetch/2.1.5/next.js',
-    '@bytedo/editor': '//jscdn.ink/@bytedo/editor/1.0.0/index.js'
+    '@bytedo/editor': '//jscdn.ink/@bytedo/editor/1.0.0/index.js',
+    '@bytedo/gzip': '//jscdn.ink/@bytedo/gzip/1.0.0/index.js',
+    '@bd/core': '//jscdn.ink/@bd/core/1.9.0/index.js'
   }
 }
diff --git a/package.json b/package.json
index beca076..f335485 100644
--- a/package.json
+++ b/package.json
@@ -6,6 +6,6 @@
     "build": "fite build"
   },
   "devDependencies": {
-    "fite": "^0.5.0"
+    "fite": "^0.6.0"
   }
-}
\ No newline at end of file
+}
diff --git a/src/pages/@wcui/docs/app.vue b/src/pages/@wcui/docs/app.vue
new file mode 100644
index 0000000..4512e78
--- /dev/null
+++ b/src/pages/@wcui/docs/app.vue
@@ -0,0 +1,14 @@
+<template>
+  <h1>it works! docs page</h1>
+  <div>
+    <wc-link to="/playground.html">plyaground</wc-link>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {}
+}
+</script>
+
+<style lang="scss"></style>
diff --git a/src/pages/@wcui/docs/main.js b/src/pages/@wcui/docs/main.js
new file mode 100644
index 0000000..092bcb1
--- /dev/null
+++ b/src/pages/@wcui/docs/main.js
@@ -0,0 +1,8 @@
+import { createApp } from 'vue'
+import App from './app.vue'
+
+import '//jscdn.ink/@bd/ui/0.1.3/form/index.js'
+
+const app = createApp(App)
+
+app.mount('.app')
diff --git a/src/pages/@wcui/docs/router.js b/src/pages/@wcui/docs/router.js
new file mode 100644
index 0000000..ea669d0
--- /dev/null
+++ b/src/pages/@wcui/docs/router.js
@@ -0,0 +1,23 @@
+
+import { createRouter, createWebHistory } from 'vue-router'
+import Home from './views/home.vue'
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [
+    {
+      path: '/',
+      name: 'home',
+      component: Home
+    },
+    {
+      path: '/about',
+      name: 'about',
+      component: () => import('./views/about.vue')
+    }
+  ]
+})
+
+export default router
+    
+    
diff --git a/src/pages/@wcui/index/app.vue b/src/pages/@wcui/index/app.vue
new file mode 100644
index 0000000..4ce1306
--- /dev/null
+++ b/src/pages/@wcui/index/app.vue
@@ -0,0 +1,14 @@
+<template>
+  <h1>it works! index page</h1>
+  <div>
+    <wc-link to="/playground.html">plyaground</wc-link>
+  </div>
+</template>
+
+<script>
+export default {
+  components: {}
+}
+</script>
+
+<style lang="scss"></style>
diff --git a/src/pages/@wcui/index/main.js b/src/pages/@wcui/index/main.js
new file mode 100644
index 0000000..092bcb1
--- /dev/null
+++ b/src/pages/@wcui/index/main.js
@@ -0,0 +1,8 @@
+import { createApp } from 'vue'
+import App from './app.vue'
+
+import '//jscdn.ink/@bd/ui/0.1.3/form/index.js'
+
+const app = createApp(App)
+
+app.mount('.app')
diff --git a/src/pages/@wcui/index/router.js b/src/pages/@wcui/index/router.js
new file mode 100644
index 0000000..ea669d0
--- /dev/null
+++ b/src/pages/@wcui/index/router.js
@@ -0,0 +1,23 @@
+
+import { createRouter, createWebHistory } from 'vue-router'
+import Home from './views/home.vue'
+
+const router = createRouter({
+  history: createWebHistory(),
+  routes: [
+    {
+      path: '/',
+      name: 'home',
+      component: Home
+    },
+    {
+      path: '/about',
+      name: 'about',
+      component: () => import('./views/about.vue')
+    }
+  ]
+})
+
+export default router
+    
+    
diff --git a/src/pages/index/app.vue b/src/pages/index/app.vue
index 7586b08..1c1d08e 100644
--- a/src/pages/index/app.vue
+++ b/src/pages/index/app.vue
@@ -1,6 +1,8 @@
 <template>
   <h1>it works!</h1>
-  <div><a href="/playground.html">plyaground</a></div>
+  <div>
+    <wc-link to="/playground.html">plyaground</wc-link>
+  </div>
 </template>
 
 <script>
diff --git a/src/pages/index/main.js b/src/pages/index/main.js
index ca3de47..092bcb1 100644
--- a/src/pages/index/main.js
+++ b/src/pages/index/main.js
@@ -1,6 +1,8 @@
 import { createApp } from 'vue'
 import App from './app.vue'
 
+import '//jscdn.ink/@bd/ui/0.1.3/form/index.js'
+
 const app = createApp(App)
 
 app.mount('.app')