diff --git a/components.d.ts b/components.d.ts
index 7f689c4..711cd21 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -10,9 +10,11 @@ export {}
 declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     ChangeLocal: typeof import('./src/components/set/preference/ChangeLocal.vue')['default']
+    ElButton: typeof import('element-plus/es')['ElButton']
     ElDialog: typeof import('element-plus/es')['ElDialog']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElInput: typeof import('element-plus/es')['ElInput']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElSelect: typeof import('element-plus/es')['ElSelect']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
diff --git a/package.json b/package.json
index 2baa196..ca2052b 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
     "fast-glob": "^3.2.12",
     "minimist": "^1.2.8",
     "rollup-plugin-livereload": "^2.0.5",
+    "stylus": "^0.59.0",
     "ts-node": "^10.9.1",
     "typescript": "^5.0.4",
     "unplugin-auto-import": "^0.16.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index efae38e..ff51c51 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -60,6 +60,9 @@ devDependencies:
   rollup-plugin-livereload:
     specifier: ^2.0.5
     version: 2.0.5
+  stylus:
+    specifier: ^0.59.0
+    version: 0.59.0
   ts-node:
     specifier: ^10.9.1
     version: 10.9.1(@types/node@18.16.14)(typescript@5.0.4)
@@ -74,10 +77,10 @@ devDependencies:
     version: 0.24.1(vue@3.2.47)
   vercel:
     specifier: ^29.4.0
-    version: 29.4.0(@types/node@18.16.14)(ts-node@10.9.1)
+    version: 29.4.0(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1)
   vite:
     specifier: ^4.3.2
-    version: 4.3.2(@types/node@18.16.14)
+    version: 4.3.2(@types/node@18.16.14)(stylus@0.59.0)
   vite-plugin-html:
     specifier: ^3.2.0
     version: 3.2.0(vite@4.3.2)
@@ -87,6 +90,10 @@ devDependencies:
 
 packages:
 
+  /@adobe/css-tools@4.2.0:
+    resolution: {integrity: sha512-E09FiIft46CmH5Qnjb0wsW54/YQd69LsxeKUOWawmws1XWvyFGURnAChH0mlr7YPFR1ofwvUQfcL0J3lMxXqPA==}
+    dev: true
+
   /@ampproject/remapping@2.2.1:
     resolution: {integrity: sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==}
     engines: {node: '>=6.0.0'}
@@ -2538,7 +2545,7 @@ packages:
       outdent: 0.8.0
     dev: true
 
-  /@vanilla-extract/integration@6.2.1(@types/node@18.16.14):
+  /@vanilla-extract/integration@6.2.1(@types/node@18.16.14)(stylus@0.59.0):
     resolution: {integrity: sha512-+xYJz07G7TFAMZGrOqArOsURG+xcYvqctujEkANjw2McCBvGEK505RxQqOuNiA9Mi9hgGdNp2JedSa94f3eoLg==}
     dependencies:
       '@babel/core': 7.21.8
@@ -2552,8 +2559,8 @@ packages:
       lodash: 4.17.21
       mlly: 1.3.0
       outdent: 0.8.0
-      vite: 4.3.2(@types/node@18.16.14)
-      vite-node: 0.28.5(@types/node@18.16.14)
+      vite: 4.3.2(@types/node@18.16.14)(stylus@0.59.0)
+      vite-node: 0.28.5(@types/node@18.16.14)(stylus@0.59.0)
     transitivePeerDependencies:
       - '@types/node'
       - less
@@ -2676,10 +2683,10 @@ packages:
       - supports-color
     dev: true
 
-  /@vercel/remix-builder@1.8.10(@types/node@18.16.14)(ts-node@10.9.1):
+  /@vercel/remix-builder@1.8.10(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1):
     resolution: {integrity: sha512-DXOjz/4HUawFojrbK9AQq1sjA2YxGbG8/bTTwSdqdYJZv0QgeK1vkOioxLmQP5qzZ7DQNK+LgSn9oMrX3Bq/lA==}
     dependencies:
-      '@remix-run/dev': /@vercel/remix-run-dev@1.16.1(@types/node@18.16.14)(ts-node@10.9.1)
+      '@remix-run/dev': /@vercel/remix-run-dev@1.16.1(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1)
       '@vercel/build-utils': 6.7.3
       '@vercel/nft': 0.22.5
       '@vercel/static-config': 2.0.17
@@ -2702,7 +2709,7 @@ packages:
       - utf-8-validate
     dev: true
 
-  /@vercel/remix-run-dev@1.16.1(@types/node@18.16.14)(ts-node@10.9.1):
+  /@vercel/remix-run-dev@1.16.1(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1):
     resolution: {integrity: sha512-b+gIUNqW9JwPKHSfGs0ylMk9U80dbvEmkjczNmyWvO7r1tz8O9dEmTUmbJ22/aRPPJQ/aEYosqP7UNJtDvieqw==}
     engines: {node: '>=14'}
     hasBin: true
@@ -2723,7 +2730,7 @@ packages:
       '@babel/types': 7.21.5
       '@npmcli/package-json': 2.0.0
       '@remix-run/server-runtime': 1.16.1
-      '@vanilla-extract/integration': 6.2.1(@types/node@18.16.14)
+      '@vanilla-extract/integration': 6.2.1(@types/node@18.16.14)(stylus@0.59.0)
       arg: 5.0.2
       cacache: 15.3.0
       chalk: 4.1.2
@@ -2819,7 +2826,7 @@ packages:
       vite: ^4.0.0
       vue: ^3.2.25
     dependencies:
-      vite: 4.3.2(@types/node@18.16.14)
+      vite: 4.3.2(@types/node@18.16.14)(stylus@0.59.0)
       vue: 3.2.47
     dev: true
 
@@ -7391,6 +7398,10 @@ packages:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
     dev: true
 
+  /sax@1.2.4:
+    resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
+    dev: true
+
   /scule@1.0.0:
     resolution: {integrity: sha512-4AsO/FrViE/iDNEPaAQlb77tf0csuq27EsVpy6ett584EcRTp6pTDLoGWVxCD77y5iU5FauOvhsI4o1APwPoSQ==}
     dev: true
@@ -7661,6 +7672,19 @@ packages:
       inline-style-parser: 0.1.1
     dev: true
 
+  /stylus@0.59.0:
+    resolution: {integrity: sha512-lQ9w/XIOH5ZHVNuNbWW8D822r+/wBSO/d6XvtyHLF7LW4KaCIDeVbvn5DF8fGCJAUCwVhVi/h6J0NUcnylUEjg==}
+    hasBin: true
+    dependencies:
+      '@adobe/css-tools': 4.2.0
+      debug: 4.3.4
+      glob: 7.2.3
+      sax: 1.2.4
+      source-map: 0.7.4
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /supports-color@5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}
@@ -8219,7 +8243,7 @@ packages:
     engines: {node: '>= 0.8'}
     dev: true
 
-  /vercel@29.4.0(@types/node@18.16.14)(ts-node@10.9.1):
+  /vercel@29.4.0(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1):
     resolution: {integrity: sha512-sVfg87dhF3q6Nhrr5zv2oaOU1zQQd+MlsjhdNkB9MfrQyXqluAdHKiNz0+g/+wJeh/y7sUhWk2/XJb5CDlF70w==}
     engines: {node: '>= 14'}
     hasBin: true
@@ -8232,7 +8256,7 @@ packages:
       '@vercel/node': 2.14.3
       '@vercel/python': 3.1.60
       '@vercel/redwood': 1.1.15
-      '@vercel/remix-builder': 1.8.10(@types/node@18.16.14)(ts-node@10.9.1)
+      '@vercel/remix-builder': 1.8.10(@types/node@18.16.14)(stylus@0.59.0)(ts-node@10.9.1)
       '@vercel/ruby': 1.3.76
       '@vercel/static-build': 1.3.32
     transitivePeerDependencies:
@@ -8269,7 +8293,7 @@ packages:
       vfile-message: 3.1.4
     dev: true
 
-  /vite-node@0.28.5(@types/node@18.16.14):
+  /vite-node@0.28.5(@types/node@18.16.14)(stylus@0.59.0):
     resolution: {integrity: sha512-LmXb9saMGlrMZbXTvOveJKwMTBTNUH66c8rJnQ0ZPNX+myPEol64+szRzXtV5ORb0Hb/91yq+/D3oERoyAt6LA==}
     engines: {node: '>=v14.16.0'}
     hasBin: true
@@ -8281,7 +8305,7 @@ packages:
       picocolors: 1.0.0
       source-map: 0.6.1
       source-map-support: 0.5.21
-      vite: 4.3.2(@types/node@18.16.14)
+      vite: 4.3.2(@types/node@18.16.14)(stylus@0.59.0)
     transitivePeerDependencies:
       - '@types/node'
       - less
@@ -8309,10 +8333,10 @@ packages:
       html-minifier-terser: 6.1.0
       node-html-parser: 5.4.2
       pathe: 0.2.0
-      vite: 4.3.2(@types/node@18.16.14)
+      vite: 4.3.2(@types/node@18.16.14)(stylus@0.59.0)
     dev: true
 
-  /vite@4.3.2(@types/node@18.16.14):
+  /vite@4.3.2(@types/node@18.16.14)(stylus@0.59.0):
     resolution: {integrity: sha512-9R53Mf+TBoXCYejcL+qFbZde+eZveQLDYd9XgULILLC1a5ZwPaqgmdVpL8/uvw2BM/1TzetWjglwm+3RO+xTyw==}
     engines: {node: ^14.18.0 || >=16.0.0}
     hasBin: true
@@ -8341,6 +8365,7 @@ packages:
       esbuild: 0.17.19
       postcss: 8.4.23
       rollup: 3.23.0
+      stylus: 0.59.0
     optionalDependencies:
       fsevents: 2.3.2
     dev: true
diff --git a/src/App.vue b/src/App.vue
index b5e9817..9a1d44e 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -29,16 +29,6 @@ import AppLayout from "~/src/layouts/AppLayout.vue"
 // global style
 import "~/src/assets/style.css"
 import "~/src/assets/style.dark.css"
-import { inject } from "vue"
-import { InjectKeys } from "~/src/utils/injectKeys.ts"
-
-// Vue 实例
-// const vueInstance = inject(InjectKeys.VUE_INSTANCE)
-// logger.info("vueInstance=>", vueInstance)
-
-// appInstance
-const appInstance = inject(InjectKeys.APP_INSTANCE) as any
-appInstance.logger.debug("appInstance=>", appInstance)
 </script>
 
 <template>
diff --git a/src/components/publish/PublishIndex.vue b/src/components/publish/PublishIndex.vue
index efb1082..f58ec7a 100644
--- a/src/components/publish/PublishIndex.vue
+++ b/src/components/publish/PublishIndex.vue
@@ -25,37 +25,78 @@
 
 <script setup lang="ts">
 import { createLogger } from "~/src/utils/simpleLogger.ts"
-import { inject, onBeforeMount } from "vue"
-import { InjectKeys } from "~/src/utils/injectKeys.ts"
+import { ref } from "vue"
 import { AppInstance } from "~/src/appInstance.ts"
 import { Utils } from "~/src/utils/utils.ts"
 import { SiYuanApiAdaptor, SiyuanConfig } from "zhi-siyuan-api"
 
 const logger = createLogger("publisher-index")
 
-// lifecycle
-onBeforeMount(async () => {
-  // appInstance
-  const appInstance: AppInstance = inject(InjectKeys.APP_INSTANCE)
-
-  // const wordpressCfg = {}
-  // const wordpressApiAdaptor = {}
-  // const wordpressApi = Utils.blogApi(appInstance, wordpressApiAdaptor)
-  // const wordpressPosts = await wordpressApi.getRecentPosts(10)
-  // logger.info("wordpress recent post=>", wordpressPosts)
-
-  const siyuanCfg = new SiyuanConfig("", "")
-  // 显示指定修复标题
-  siyuanCfg.fixTitle = true
-  const siyuanApiAdaptor = new SiYuanApiAdaptor(siyuanCfg)
-  const siyuanApi = Utils.blogApi(appInstance, siyuanApiAdaptor)
-  const siyuanPosts = await siyuanApi.getRecentPosts(10)
-  logger.info("siyuan recent post=>", siyuanPosts)
-})
+const logMessage = ref("")
+
+const siyuanGetRecentPosts = async () => {
+  logMessage.value = ""
+  logMessage.value = "siyuan requesting..."
+  try {
+    // appInstance
+    const appInstance = new AppInstance()
+    await appInstance.init()
+    logger.info("appInstance=>", appInstance)
+
+    const siyuanCfg = new SiyuanConfig("", "")
+    // 显示指定修复标题
+    siyuanCfg.fixTitle = true
+    const siyuanApiAdaptor = new SiYuanApiAdaptor(siyuanCfg)
+    const siyuanApi = Utils.blogApi(appInstance, siyuanApiAdaptor)
+    const siyuanPosts = await siyuanApi.getRecentPosts(10)
+    logMessage.value = JSON.stringify(siyuanPosts)
+    logger.info("siyuan recent post=>", siyuanPosts)
+  } catch (e) {
+    logMessage.value = e
+  }
+}
+
+const wordpressGetRecentPosts = async () => {
+  logMessage.value = ""
+  logMessage.value = "wordpress requesting..."
+  try {
+    // appInstance
+    const appInstance = new AppInstance()
+    await appInstance.init()
+    logger.info("appInstance=>", appInstance)
+
+    const wordpressCfg = {}
+    const wordpressApiAdaptor = {}
+    const wordpressApi = Utils.blogApi(appInstance, wordpressApiAdaptor)
+    const wordpressPosts = await wordpressApi.getRecentPosts(10)
+    logMessage.value = JSON.stringify(wordpressPosts)
+    logger.info("wordpress recent post=>", wordpressPosts)
+  } catch (e) {
+    logMessage.value = e
+  }
+}
 </script>
 
 <template>
-  <div>PublishIndex222222</div>
+  <div id="publish-index">
+    <el-tabs type="border-card">
+      <el-tab-pane label="思源">
+        <p><el-button @click="siyuanGetRecentPosts">文章列表</el-button></p>
+        <p><el-button>单篇文章</el-button></p>
+      </el-tab-pane>
+      <el-tab-pane label="WordPress">
+        <p><el-button @click="wordpressGetRecentPosts">文章列表</el-button></p>
+        <p><el-button>单篇文章</el-button></p>
+      </el-tab-pane>
+    </el-tabs>
+
+    <p>
+      <el-input v-model="logMessage" type="textarea" :rows="10" placeholder="日志信息"></el-input>
+    </p>
+  </div>
 </template>
 
-<style scoped></style>
+<style lang="stylus" scoped>
+#publish-index
+  margin 16px 20px
+</style>
diff --git a/src/main.ts b/src/main.ts
index 6553984..c5c8e62 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -58,6 +58,7 @@ import { AppInstance } from "~/src/appInstance.ts"
   const appInstance = new AppInstance()
   await appInstance.init()
   app.provide(InjectKeys.APP_INSTANCE, appInstance)
+  logger.info("appInstance provided=>", appInstance)
 
   // ElementPlus
   // 包太大，需要改成按需引入
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index 936d1f4..b5d331b 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -63,7 +63,7 @@ export class Utils {
 
     if (!apiAdaptor.getUsersBlogs) {
       this.logger.error("ApiAdaptor must implements BlogApi", apiAdaptor)
-      throw new Error(`ApiAdaptor must implements BlogApi`)
+      throw new Error(`ApiAdaptor must implements BlogApi => ${this.getObjectName(apiAdaptor)}`)
     }
 
     if (apiAdaptor.init) {
@@ -72,4 +72,32 @@ export class Utils {
 
     return new BlogAdaptor(apiAdaptor)
   }
+
+  private static getObjectName(obj) {
+    try {
+      // 判断是否为类
+      if (typeof obj === "function" && /^class\s/.test(obj.toString())) {
+        return obj.name
+      }
+      // 判断是否为函数
+      else if (typeof obj === "function") {
+        return obj.name || "anonymous function"
+      }
+      // 判断是否为枚举
+      else if (typeof obj === "object" && Object.values(obj.constructor).includes(obj)) {
+        return Object.keys(obj.constructor)[Object.values(obj.constructor).indexOf(obj)]
+      }
+      // 判断是否为属性
+      else if (typeof obj !== "object") {
+        return obj
+      }
+      // 默认返回空字符串
+      else {
+        return "{}"
+      }
+    } catch (e) {
+      console.error(e)
+      return "{}"
+    }
+  }
 }
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 33edefd..56be816 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -28,9 +28,7 @@ import PublishIndex from "~/src/components/publish/PublishIndex.vue"
 </script>
 
 <template>
-  <div id="publish-index">
-    <publish-index />
-  </div>
+  <publish-index />
 </template>
 
 <style scoped></style>