feat: add vuepress-plugin-demo-container and update documentation with demo examples

docs/.vuepress/config.ts

@@ -0,0 +1,5 @@
+import path from 'path'
+
+export default {
+    plugins: ['demo-container'],
+}

docs/.vuepress/enhanceApp.js

@@ -0,0 +1,8 @@
+import { VaguerComponents } from "../../dist/vaguer.js"
+import "../../dist/style.css"
+
+export default ({
+    Vue,
+}) => {
+    Vue.use(VaguerComponents)
+}

docs/README.md

@@ -1,3 +1,29 @@
 # Hello VuePressasd
 
-Fuck
+组件展示
+
+::: demo 此处放置代码示例的描述信息，支持 `Markdown` 语法，**描述信息只支持单行**
+```html
+<template>
+  <div class="red-center-text">
+      <VaguerButton>{{ message }}</VaguerButton>
+      <input v-model="message" placeholder="Input something..."/>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      message: 'Hello Vue'
+    }
+  }
+}
+</script>
+<style>
+.red-center-text { 
+  color: #ff7875;
+  text-align: center;
+}
+</style>
+```
+:::

package.json

@@ -55,7 +55,8 @@
         "vue": "2.6.14",
         "vue-server-renderer": "2.6.14",
         "vue-template-compiler": "2.6.14",
-        "vuepress": "^1.9.10"
+        "vuepress": "^1.9.10",
+        "vuepress-plugin-demo-container": "^0.2.0"
     },
     "volta": {
         "node": "18.17.1",

pnpm-lock.yaml

@@ -53,6 +53,9 @@ importers:
       vuepress:
         specifier: ^1.9.10
         version: 1.9.10(@vue/compiler-sfc@3.5.25)(hogan.js@3.0.2)(lodash@4.17.21)
+      vuepress-plugin-demo-container:
+        specifier: ^0.2.0
+        version: 0.2.0
 
 packages:
 
@@ -7395,6 +7398,9 @@ packages:
   vuepress-plugin-container@2.1.5:
     resolution: {integrity: sha512-TQrDX/v+WHOihj3jpilVnjXu9RcTm6m8tzljNJwYhxnJUW0WWQ0hFLcDTqTBwgKIFdEiSxVOmYE+bJX/sq46MA==}
 
+  vuepress-plugin-demo-container@0.2.0:
+    resolution: {integrity: sha512-IXWZUc9+mErxjhBMRvhjHkGlXC3aXLS8wRV4kh4RZYAOVtb8nLv2fmpzwrSZrnIOXLGMcMTObdFruVzX9kBylw==}
+
   vuepress-plugin-smooth-scroll@0.0.3:
     resolution: {integrity: sha512-qsQkDftLVFLe8BiviIHaLV0Ea38YLZKKonDGsNQy1IE0wllFpFIEldWD8frWZtDFdx6b/O3KDMgVQ0qp5NjJCg==}
 
@@ -16010,6 +16016,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  vuepress-plugin-demo-container@0.2.0: {}
+
   vuepress-plugin-smooth-scroll@0.0.3:
     dependencies:
       smoothscroll-polyfill: 0.4.4

readme.md

@@ -1,2 +1,3 @@
 https://github.com/wheatjs/vaguer
 https://v1.vuepress.vuejs.org/zh/
+https://docs.chenjianhui.site/vuepress-plugin-demo-container/zh/complex.html#todomvc-%E7%A4%BA%E4%BE%8B

src/components/VaguerButton/VaguerButton.vue

@@ -10,7 +10,7 @@ export default {
 
 <template>
     <button class="vaguer-button">
-        <slot />-{{ a }}
+        <slot />
     </button>
 </template>