diff --git a/.inscode b/.inscode
index 70c7853df0c162981ebd7cf119d909c807920531..9fec9576d482baaf90d2f47230ce9133cfce99d4 100644
--- a/.inscode
+++ b/.inscode
@@ -1,4 +1,5 @@
 run = "npm i && npm run dev"
+language = "node"
 
 [deployment]
 build = "npm i && npm run build"
@@ -8,3 +9,6 @@ run = "npm run preview"
 PATH = "/root/${PROJECT_DIR}/.config/npm/node_global/bin:/root/${PROJECT_DIR}/node_modules/.bin:${PATH}"
 XDG_CONFIG_HOME = "/root/.config"
 npm_config_prefix = "/root/${PROJECT_DIR}/.config/npm/node_global"
+
+[debugger]
+program = "main.js"
diff --git a/package.json b/package.json
index aa1c7deb0adb6e6aea5a1380426189ac24eee7a7..0dc0cea4a57fd112d140eb1cae52236d6755798c 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,8 @@
   },
   "dependencies": {
     "guess": "^1.0.2",
-    "vue": "^3.2.37"
+    "vue": "^3.2.37",
+    "vue-esign": "^1.1.4"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^3.0.1",
diff --git a/src/App.vue b/src/App.vue
index 633a5dfe4e547c48bfa93740a290ba5ba370930a..94f9c1e616891e95253e400062dfbff4877db812 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,32 +1,39 @@
-<script setup>
-import HelloWorld from './components/HelloWorld.vue'
-import TheWelcome from './components/TheWelcome.vue'
+<script>
+import vueEsign from 'vue-esign'
+export default {
+  components: {vueEsign},
+  data() {
+    return {
+      imgUrl: ''
+    }
+  },
+  methods: {
+    confirm() {
+      this.$refs.esign.generate().then(res => {
+        this.imgUrl = res
+        console.log(res)
+      }).catch(() => {
+        alert('请签名！')
+      })
+    }
+  }
+}
 </script>
 
 <template>
-  <header>
-    <img alt="Vue logo" class="logo" src="./assets/logo.svg" width="125" height="125" />
-
-    <div class="wrapper">
-      <HelloWorld msg="You did it!" />
-    </div>
-  </header>
-
-  <main>
-    <TheWelcome />
-  </main>
+  <div>
+    <button @click="confirm">确认</button>
+    <button style="margin-left: 10px;">清除</button>
+    <vueEsign ref="esign" style="border: 1px solid blue;" width="500" height="200" />
+    <img v-if="imgUrl" :src="imgUrl" width="500" height="200" alt="">
+  </div>
 </template>
 
 <style scoped>
-header {
-  line-height: 1.5;
+button{
+  width: 52px;
+  height: 23px;
 }
-
-.logo {
-  display: block;
-  margin: 0 auto 2rem;
-}
-
 @media (min-width: 1024px) {
   header {
     display: flex;