{"_id":"@banbrider/vue3-vditor","_rev":"5-857e8ac52d837d7e95af4da6db5a86aa","name":"@banbrider/vue3-vditor","dist-tags":{"latest":"1.3.0"},"versions":{"1.0.0":{"name":"@banbrider/vue3-vditor","version":"1.0.0","keywords":["markdown","vue","vditor","editor"],"author":{"name":"banbrider"},"license":"MIT","_id":"@banbrider/vue3-vditor@1.0.0","maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"homepage":"https://gitee.com/banyunjian/vue3-vditor.git","dist":{"shasum":"7363a97740ce07d4ed5ef7d9c4ba3296b3c21761","tarball":"https://registry.npmjs.org/@banbrider/vue3-vditor/-/vue3-vditor-1.0.0.tgz","fileCount":5,"integrity":"sha512-yfnl/dwUpdAyKUxWzp/rknwZZFfUIJ4u1/scCOGvis6lyeGowHUPZGSHVII27aA1vFHMXTD4qf1q+oOXDkkL+w==","signatures":[{"sig":"MEUCIQCkTF8ykma2LfyxAtdz4Wcw+eBXtkPhCoEYRPpByhWsyQIgfXXtYMRCKcn5cA9r/BuuRl9lNnHDvoNBP9Y8/T3pacs=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":21719},"main":"./lib/index.umd.js","config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"module":"./lib/index.es.js","engines":{"node":">=12"},"exports":{".":{"import":"./lib/index.es.js","require":"./lib/index.umd.js"}},"gitHead":"8a12a721547c53edbfa02fa9b105cff44abe54c5","scripts":{"dev":"vite","build":"vite build","serve":"vite preview","release":"npm run build && standard-version --infile CHANGELOG.md "},"_npmUser":{"name":"banbrider","email":"1804239177@qq.com"},"repository":{"url":"https://gitee.com/banyunjian/vue3-vditor.git","type":"git"},"_npmVersion":"9.8.1","description":"基于vditor实现的vue3版本的markdown编辑器","directories":{},"_nodeVersion":"18.18.0","dependencies":{"vue-demi":"latest"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","vue-tsc":"^2.0.0","typescript":"^5.0.0","@types/node":"^20.0.0","standard-version":"^9.5.0","@banbrider/vditor":"^1.0.0","@vue/compiler-sfc":"^3.4.0","@vitejs/plugin-vue":"^5.0.0","rollup-plugin-typescript2":"^0.31.0"},"peerDependencies":{"vue":"^3.0.0","vditor":"~3.8.5"},"standard-version":{"skip":{"commit":false}},"_npmOperationalInternal":{"tmp":"tmp/vue3-vditor_1.0.0_1781528012840_0.6808539725210607","host":"s3://npm-registry-packages-npm-production"}},"1.0.1":{"name":"@banbrider/vue3-vditor","version":"1.0.1","keywords":["markdown","vue","vditor","editor"],"author":{"name":"banbrider"},"license":"MIT","_id":"@banbrider/vue3-vditor@1.0.1","maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"homepage":"https://gitee.com/banyunjian/vue3-vditor.git","dist":{"shasum":"913b0ad36a9a07d0cec34c5144db7e9b16e0924a","tarball":"https://registry.npmjs.org/@banbrider/vue3-vditor/-/vue3-vditor-1.0.1.tgz","fileCount":5,"integrity":"sha512-rOwVNbuBFvsDEGP7EUgwxKIbuelzpXtzXY0gGxVTEGyLgPb0ruYFfMjRRAMKapepG3NZFDwR8nracJzo/my2oA==","signatures":[{"sig":"MEUCIQD6eeqzllpEkgEXlp9uBplbU5pXKTWElLCARFOL0p/5pgIgSA/M5BeqAfMeFuAVi33Nu/OXm2uDsreOzVwf5eBBq3g=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":21713},"main":"./lib/index.umd.js","config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"module":"./lib/index.mjs","engines":{"node":">=12"},"exports":{".":{"import":"./lib/index.mjs","require":"./lib/index.umd.js"}},"gitHead":"c23bfed67aea3cb171236118ee1271de1210876e","scripts":{"dev":"vite","build":"vite build","serve":"vite preview","release":"npm run build && standard-version --infile CHANGELOG.md "},"_npmUser":{"name":"banbrider","email":"1804239177@qq.com"},"repository":{"url":"https://gitee.com/banyunjian/vue3-vditor.git","type":"git"},"_npmVersion":"9.8.1","description":"基于vditor实现的vue3版本的markdown编辑器","directories":{},"_nodeVersion":"18.18.0","dependencies":{"vue-demi":"latest"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","vue-tsc":"^2.0.0","typescript":"^5.0.0","@types/node":"^20.0.0","standard-version":"^9.5.0","@banbrider/vditor":"^1.0.0","@vue/compiler-sfc":"^3.4.0","@vitejs/plugin-vue":"^5.0.0","rollup-plugin-typescript2":"^0.31.0"},"peerDependencies":{"vue":"^3.0.0","vditor":"~3.8.5"},"standard-version":{"skip":{"commit":false}},"_npmOperationalInternal":{"tmp":"tmp/vue3-vditor_1.0.1_1781529336273_0.41697153191973024","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"@banbrider/vue3-vditor","version":"1.1.0","keywords":["markdown","vue","vditor","editor"],"author":{"name":"banbrider"},"license":"MIT","_id":"@banbrider/vue3-vditor@1.1.0","maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"homepage":"https://gitee.com/banyunjian/vue3-vditor.git","dist":{"shasum":"e70d739c3992c57351043acfcf77ad84a629ebd3","tarball":"https://registry.npmjs.org/@banbrider/vue3-vditor/-/vue3-vditor-1.1.0.tgz","fileCount":5,"integrity":"sha512-IOdiID8kPEBBHTo4yftYWbpHbr0Jx1Psly+gMEXJx3E4ufCzpPoHd2VoY2z/j06rQ9Q2WjLF3DIcyBQN1hQqOA==","signatures":[{"sig":"MEQCIBVwvxDXVLp91d5MhjalXCwhaS9+eKtD2BF6Er2KnLM9AiAh5YDwBYvtAMI1RbOjLOHgKoUbbceizEVPTSyx3lwDRA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27279},"main":"./lib/index.umd.js","config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"module":"./lib/index.mjs","engines":{"node":">=12"},"exports":{".":{"import":"./lib/index.mjs","require":"./lib/index.umd.js"}},"gitHead":"77ebcbc353bcc09fbe81002dc10c8162bf45c1f6","scripts":{"dev":"vite","build":"vite build","serve":"vite preview","release":"npm run build && standard-version --infile CHANGELOG.md "},"_npmUser":{"name":"banbrider","email":"1804239177@qq.com"},"repository":{"url":"https://gitee.com/banyunjian/vue3-vditor.git","type":"git"},"_npmVersion":"9.8.1","description":"基于vditor实现的vue3版本的markdown编辑器","directories":{},"_nodeVersion":"18.18.0","dependencies":{"vue-demi":"latest"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","vue-tsc":"^2.0.0","typescript":"^5.0.0","@types/node":"^20.0.0","standard-version":"^9.5.0","@banbrider/vditor":"^1.2.0","@vue/compiler-sfc":"^3.4.0","@vitejs/plugin-vue":"^5.0.0","rollup-plugin-typescript2":"^0.31.0"},"peerDependencies":{"vue":"^3.0.0","vditor":"~3.8.5"},"standard-version":{"skip":{"commit":false}},"_npmOperationalInternal":{"tmp":"tmp/vue3-vditor_1.1.0_1783949339087_0.570627381977808","host":"s3://npm-registry-packages-npm-production"}},"1.2.0":{"name":"@banbrider/vue3-vditor","version":"1.2.0","keywords":["markdown","vue","vditor","editor"],"author":{"name":"banbrider"},"license":"MIT","_id":"@banbrider/vue3-vditor@1.2.0","maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"homepage":"https://gitee.com/banyunjian/vue3-vditor.git","dist":{"shasum":"3c20760c2b56763a78d47051b4bddde94ef37a49","tarball":"https://registry.npmjs.org/@banbrider/vue3-vditor/-/vue3-vditor-1.2.0.tgz","fileCount":5,"integrity":"sha512-O6iIeFcQ23JDhP9FBwYyXoDd+xhiayK0uXH/HK85rbxTPJRt3o483inhmHv2nmtnlT6te+XOnCI3qf18G+pANA==","signatures":[{"sig":"MEQCIAEm48ftYMk/jscXQNrv3Xg37eEaaTsbkSIX98HOE6i2AiA0cyTQ7BgAVg5aakvGSmNW6Q4mwLKOHgiLz8Y553p5wQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27264},"main":"./lib/index.umd.js","config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"module":"./lib/index.mjs","engines":{"node":">=12"},"exports":{".":{"import":"./lib/index.mjs","require":"./lib/index.umd.js"}},"gitHead":"abc2fbf38af0b2bd642dfdbd43a25e6edab39641","scripts":{"dev":"vite","build":"vite build","serve":"vite preview","release":"npm run build && standard-version --infile CHANGELOG.md "},"_npmUser":{"name":"banbrider","email":"1804239177@qq.com"},"repository":{"url":"https://gitee.com/banyunjian/vue3-vditor.git","type":"git"},"_npmVersion":"9.8.1","description":"基于vditor实现的vue3版本的markdown编辑器","directories":{},"_nodeVersion":"18.18.0","dependencies":{"vue-demi":"latest","@banbrider/vditor":"^1.2.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","vue-tsc":"^2.0.0","typescript":"^5.0.0","@types/node":"^20.0.0","standard-version":"^9.5.0","@vue/compiler-sfc":"^3.4.0","@vitejs/plugin-vue":"^5.0.0","rollup-plugin-typescript2":"^0.31.0"},"peerDependencies":{"vue":"^3.0.0"},"standard-version":{"skip":{"commit":false}},"_npmOperationalInternal":{"tmp":"tmp/vue3-vditor_1.2.0_1783951513597_0.14783880599322274","host":"s3://npm-registry-packages-npm-production"}},"1.3.0":{"name":"@banbrider/vue3-vditor","version":"1.3.0","author":{"name":"banbrider"},"license":"MIT","keywords":["markdown","vue","vditor","editor"],"description":"基于vditor实现的vue3版本的markdown编辑器","scripts":{"dev":"vite","build":"vite build","serve":"vite preview","release":"npm run build && standard-version --infile CHANGELOG.md "},"main":"./lib/index.umd.js","module":"./lib/index.mjs","exports":{".":{"import":"./lib/index.mjs","require":"./lib/index.umd.js"},"./lib/style.css":"./lib/style.css"},"style":"./lib/style.css","publishConfig":{"access":"public"},"homepage":"https://gitee.com/banyunjian/vue3-vditor.git","repository":{"type":"git","url":"https://gitee.com/banyunjian/vue3-vditor.git"},"engines":{"node":">=12"},"dependencies":{"@banbrider/vditor":"^1.2.0","vue-demi":"latest"},"peerDependencies":{"vue":"^3.0.0"},"devDependencies":{"@types/node":"^20.0.0","@vitejs/plugin-vue":"^5.0.0","@vue/compiler-sfc":"^3.4.0","rollup-plugin-typescript2":"^0.31.0","standard-version":"^9.5.0","typescript":"^5.0.0","vite":"^5.0.0","vue-tsc":"^2.0.0"},"config":{"commitizen":{"path":"./node_modules/cz-conventional-changelog"}},"standard-version":{"skip":{"commit":false}},"_id":"@banbrider/vue3-vditor@1.3.0","gitHead":"eb8640e7bfaf4b89e92cbcfd4ccde9f1a8f91781","_nodeVersion":"18.18.0","_npmVersion":"9.8.1","dist":{"integrity":"sha512-RsoKzqjbi0F5Dw+7F9bZg1euru+yRxK6EukMbOouGJ4cK29JAsf3mgwPRFbb+JXPKL29KpORII5wxaOn8jWiiw==","shasum":"21c8cc6188ac63040975b05c140080ff8455af12","tarball":"https://registry.npmjs.org/@banbrider/vue3-vditor/-/vue3-vditor-1.3.0.tgz","fileCount":6,"unpackedSize":63983,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQDzodLREWkRJAEB2Te7AXm6ZBb390nMvATWiqFa420PCgIgA0alqLJFnl8yFW8giw+yxG6KcqoaIlZQ7BVHbfHO3pg="}]},"_npmUser":{"name":"banbrider","email":"1804239177@qq.com"},"directories":{},"maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/vue3-vditor_1.3.0_1784032630921_0.48596797111965606"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-15T12:53:32.658Z","modified":"2026-07-14T12:37:12.234Z","1.0.0":"2026-06-15T12:53:32.971Z","1.0.1":"2026-06-15T13:15:36.419Z","1.1.0":"2026-07-13T13:28:59.219Z","1.2.0":"2026-07-13T14:05:13.757Z","1.3.0":"2026-07-14T12:37:11.223Z"},"author":{"name":"banbrider"},"license":"MIT","homepage":"https://gitee.com/banyunjian/vue3-vditor.git","keywords":["markdown","vue","vditor","editor"],"repository":{"type":"git","url":"https://gitee.com/banyunjian/vue3-vditor.git"},"description":"基于vditor实现的vue3版本的markdown编辑器","maintainers":[{"name":"banbrider","email":"1804239177@qq.com"}],"readme":"# Vue Vditor\r\n\r\n一款基于 [Vditor](https://b3log.org/vditor/) 实现的 Vue 版 Markdown 编辑器，支持在 Vue 3.0 中使用。\r\n\r\n## ✨ 特性\r\n\r\n- 🎨 **三种编辑模式**：完整模式、简洁模式、移动端模式\r\n- 🌈 **主题切换**：支持经典主题和深色主题\r\n- 🛡️ **安全过滤**：内置 XSS 过滤机制\r\n- 📝 **Markdown 支持**：完整的 Markdown 语法支持，兼容 HTML\r\n- 🎯 **代码高亮**：支持多种代码语言高亮\r\n- 📐 **数学公式**：支持 KaTeX 和 MathJax 渲染\r\n- 📊 **表格支持**：完整的表格编辑功能\r\n- 🖼️ **图片上传**：支持图片上传和预览\r\n- 📑 **目录生成**：自动生成文章目录\r\n- 🔄 **历史记录**：支持撤销/重做操作\r\n- 🔧 **高度可配置**：丰富的配置选项满足各种需求\r\n- ♿ **无障碍友好**：良好的键盘操作支持\r\n- 💚 **Vue 2/3 兼容**：通过 vue-demi 实现统一 API\r\n\r\n## 🚀 快速开始\r\n\r\n### 安装\r\n\r\n#### Vue 3\r\n```bash\r\nnpm install vue3-vditor vditor\r\n```\r\n\r\n### 使用方法\r\n\r\n#### 方式一：插件注册（推荐）\r\n\r\n```vue\r\n<template>\r\n  <div>\r\n    <VueVditor\r\n      v-model=\"content\"\r\n      :options=\"options\"\r\n      @after=\"handleAfter\"\r\n      class=\"editor\"\r\n    />\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport 'vditor/dist/index.css';\r\nimport VueVditor from 'vue3-vditor';\r\n\r\nexport default {\r\n  components: { VueVditor },\r\n  data() {\r\n    return {\r\n      content: '# Hello World\\n\\n欢迎使用 Vue Vditor',\r\n      options: {\r\n        height: '500px',\r\n        theme: 'classic',\r\n        mode: 'wysiwyg'\r\n      }\r\n    };\r\n  },\r\n  methods: {\r\n    handleAfter(editor) {\r\n      console.log('编辑器初始化完成', editor);\r\n    }\r\n  }\r\n};\r\n</script>\r\n\r\n<style>\r\n.editor {\r\n  margin: 20px;\r\n}\r\n</style>\r\n```\r\n\r\n#### 方式二：直接引入\r\n\r\n```vue\r\n<template>\r\n  <VueVditor v-model=\"content\" class=\"editor\" />\r\n</template>\r\n\r\n<script>\r\nimport 'vditor/dist/index.css';\r\nimport VueVditor from 'vue3-vditor';\r\n\r\nexport default {\r\n  components: { VueVditor },\r\n  data() {\r\n    return {\r\n      content: '# Hello World'\r\n    };\r\n  }\r\n};\r\n</script>\r\n```\r\n\r\n### 方式三：TypeScript 使用\r\n\r\n```vue\r\n<template>\r\n  <VueVditor\r\n    v-model=\"content\"\r\n    :options=\"options\"\r\n    @after=\"handleAfter\"\r\n    class=\"editor\"\r\n  />\r\n</template>\r\n\r\n<script lang=\"ts\">\r\nimport { ref, defineComponent } from 'vue-demi';\r\nimport Vditor from 'vditor';\r\n\r\nexport default defineComponent({\r\n  setup() {\r\n    const content = ref('# Hello World');\r\n    let editor: Vditor | null = null;\r\n\r\n    const options = {\r\n      height: '500px',\r\n      theme: 'classic'\r\n    };\r\n\r\n    const handleAfter = (editorInstance: Vditor) => {\r\n      editor = editorInstance;\r\n      console.log('编辑器初始化完成');\r\n    };\r\n\r\n    return {\r\n      content,\r\n      options,\r\n      handleAfter\r\n    };\r\n  }\r\n});\r\n</script>\r\n\r\n<style scoped>\r\n.editor {\r\n  margin: 20px;\r\n}\r\n</style>\r\n```\r\n\r\n## 📖 配置选项\r\n\r\n### Props\r\n\r\n| 属性 | 类型 | 必填 | 默认值 | 说明 |\r\n|------|------|------|--------|------|\r\n| `mode` | `'simple' \\| 'full' \\| 'mobile'` | 否 | `'full'` | 编辑器模式 |\r\n| `modelValue` | `string` | 否 | `''` | 编辑器内容（双向绑定） |\r\n| `options` | `IOptions` | 否 | `{}` | Vditor 配置对象 |\r\n\r\n### Events\r\n\r\n| 事件名 | 说明 | 参数 |\r\n|--------|------|------|\r\n| `update:modelValue` | 内容更新时触发 | `value: string` |\r\n| `after` | 编辑器异步渲染完成 | `editor: Vditor` |\r\n| `focus` | 编辑器聚焦时触发 | `value: string` |\r\n| `blur` | 编辑器失焦时触发 | `value: string` |\r\n| `esc` | `Esc` 按下时触发 | `value: string` |\r\n| `ctrlEnter` | `⌘/Ctrl+Enter` 按下时触发 | `value: string` |\r\n| `select` | 编辑器选中文字时触发 | `value: string` |\r\n\r\n### Methods\r\n\r\n通过 `@after` 事件获取 Vditor 实例后，可调用 Vditor 所有方法：\r\n\r\n```vue\r\n<VueVditor\r\n  v-model=\"content\"\r\n  @after=\"handleAfter\"\r\n/>\r\n```\r\n\r\n```javascript\r\nlet editor = null;\r\n\r\nfunction handleAfter(editorInstance) {\r\n  editor = editorInstance;\r\n\r\n  // 插入内容\r\n  editor.insertValue('![](https://example.com/image.jpg)');\r\n\r\n  // 获取 Markdown 内容\r\n  const markdown = editor.getValue();\r\n\r\n  // 获取 HTML 内容\r\n  const html = editor.getHTML();\r\n\r\n  // 启用编辑器\r\n  editor.enable();\r\n\r\n  // 禁用编辑器\r\n  editor.disabled();\r\n\r\n  // 销毁编辑器\r\n  editor.destroy();\r\n\r\n  // 切换主题\r\n  editor.setTheme('dark', 'dark');\r\n}\r\n```\r\n\r\n## 🎯 编辑器模式\r\n\r\n### 完整模式 (full)\r\n\r\n包含所有工具栏选项，功能最全面。\r\n\r\n```vue\r\n<VueVditor v-model=\"content\" mode=\"full\" />\r\n```\r\n\r\n### 简洁模式 (simple)\r\n\r\n精简工具栏，适合轻量级场景。\r\n\r\n```vue\r\n<VueVditor v-model=\"content\" mode=\"simple\" />\r\n```\r\n\r\n### 移动端模式 (mobile)\r\n\r\n为移动设备优化，提供基本编辑功能。\r\n\r\n```vue\r\n<VueVditor v-model=\"content\" mode=\"mobile\" />\r\n```\r\n\r\n## 🎨 高级配置\r\n\r\n### 基础配置\r\n\r\n```javascript\r\nconst options = {\r\n  // 编辑器高度\r\n  height: 500,\r\n\r\n  // 编辑器最小高度\r\n  minHeight: 200,\r\n\r\n  // 编辑器宽度\r\n  width: '100%',\r\n\r\n  // 占位符文本\r\n  placeholder: '请输入内容...',\r\n\r\n  // 编辑模式：wysiwyg（所见即所得）、sv（分屏）、ir（即时渲染）\r\n  mode: 'wysiwyg',\r\n\r\n  // 主题：classic（经典）、dark（深色）\r\n  theme: 'classic',\r\n\r\n  // 图标风格：ant、material\r\n  icon: 'ant',\r\n\r\n  // 多语言：zh_CN、en_US、ja_JP、ko_KR、ru_RU、zh_TW\r\n  lang: 'zh_CN',\r\n\r\n  // 是否启用打字机模式\r\n  typewriterMode: false,\r\n\r\n  // 是否启用全屏\r\n  fullscreen: true,\r\n\r\n  // 输入为空时的提示\r\n  placeholder: '开始输入...'\r\n};\r\n```\r\n\r\n### 上传配置\r\n\r\n```javascript\r\nconst options = {\r\n  upload: {\r\n    // 上传 URL（需要后端支持）\r\n    url: '/api/upload',\r\n\r\n    // 上传文件最大大小（字节）\r\n    max: 1024 * 1024 * 10, // 10MB\r\n\r\n    // 文件上传类型\r\n    accept: 'image/*',\r\n\r\n    // 是否允许多文件上传\r\n    multiple: true,\r\n\r\n    // 文件字段名\r\n    fieldName: 'file',\r\n\r\n    // 自定义上传处理器\r\n    handler(files) {\r\n      // files: File[]\r\n\r\n      // 返回 'uploading' 表示正在上传\r\n      return 'uploading';\r\n\r\n      // 返回 'error' 表示上传失败\r\n      return 'error';\r\n\r\n      // 返回 URL 字符串表示上传成功\r\n      return 'https://example.com/image.jpg';\r\n    },\r\n\r\n    // 上传成功回调\r\n    success(editor, msg) {\r\n      console.log('上传成功:', msg);\r\n    },\r\n\r\n    // 上传失败回调\r\n    error(msg) {\r\n      console.error('上传失败:', msg);\r\n    },\r\n\r\n    // 对服务端返回的数据进行转换\r\n    format(files, responseText) {\r\n      // 解析响应并返回图片 URL\r\n      return JSON.parse(responseText).url;\r\n    },\r\n\r\n    // 链接转图片上传的格式化\r\n    linkToImgFormat(responseText) {\r\n      return JSON.parse(responseText).url;\r\n    }\r\n  }\r\n};\r\n```\r\n\r\n### 预览配置\r\n\r\n```javascript\r\nconst options = {\r\n  preview: {\r\n    // 预览延迟时间（毫秒）\r\n    delay: 1000,\r\n\r\n    // 预览区域最大宽度\r\n    maxWidth: 768,\r\n\r\n    // 显示模式：both（分屏）、editor（仅编辑器）\r\n    mode: 'both',\r\n\r\n    // 代码高亮配置\r\n    hljs: {\r\n      enable: true,\r\n      lineNumber: false,\r\n      style: 'github' // 可选: github、atom-one-dark、mono-blue 等\r\n    },\r\n\r\n    // 数学公式配置\r\n    math: {\r\n      engine: 'KaTeX', // 可选: KaTeX、MathJax\r\n      inlineDigit: false,\r\n      macros: {}\r\n    },\r\n\r\n    // Markdown 解析配置\r\n    markdown: {\r\n      autoSpace: false,\r\n      paragraphBeginningSpace: false,\r\n      fixTermTypo: false,\r\n      toc: false,\r\n      footnotes: true,\r\n      codeBlockPreview: true,\r\n      mathBlockPreview: true,\r\n      sanitize: true,\r\n      linkBase: '',\r\n      linkPrefix: '',\r\n      listStyle: false,\r\n      mark: true\r\n    },\r\n\r\n    // 预览主题\r\n    theme: {\r\n      current: 'classic',\r\n      list: {\r\n        classic: 'https://cdn.jsdelivr.net/npm/vditor@3.8.5/dist/css/content-theme/default.css',\r\n        light: 'https://cdn.jsdelivr.net/npm/vditor@3.8.5/dist/css/content-theme/default.css',\r\n        dark: 'https://cdn.jsdelivr.net/npm/vditor@3.8.5/dist/css/content-theme/github-dark.css'\r\n      }\r\n    },\r\n\r\n    // 预览设备预设\r\n    actions: ['desktop', 'tablet', 'mobile']\r\n  }\r\n};\r\n```\r\n\r\n### 工具栏配置\r\n\r\n```javascript\r\nconst options = {\r\n  // 完整工具栏配置\r\n  toolbar: [\r\n    'emoji',\r\n    'headings',\r\n    'bold',\r\n    'italic',\r\n    'strike',\r\n    '|',\r\n    'list',\r\n    'ordered-list',\r\n    'check',\r\n    'outdent',\r\n    'indent',\r\n    '|',\r\n    'quote',\r\n    'line',\r\n    'code',\r\n    'inline-code',\r\n    'insert-before',\r\n    'insert-after',\r\n    '|',\r\n    'table',\r\n    '|',\r\n    'undo',\r\n    'redo',\r\n    '|',\r\n    'fullscreen',\r\n    'edit-mode',\r\n    'outline',\r\n    'preview',\r\n    'devtools',\r\n    'help'\r\n  ]\r\n};\r\n\r\n// 简洁模式工具栏\r\nconst simpleConfig = [\r\n  'emoji',\r\n  'headings',\r\n  'bold',\r\n  'italic',\r\n  'strike',\r\n  '|',\r\n  'list',\r\n  'ordered-list',\r\n  'check',\r\n  'outdent',\r\n  'indent',\r\n  '|',\r\n  'quote',\r\n  'line',\r\n  'code',\r\n  'inline-code',\r\n  'insert-before',\r\n  'insert-after',\r\n  '|',\r\n  'table'\r\n];\r\n\r\n// 移动端模式工具栏\r\nconst mobileConfig = [\r\n  'emoji',\r\n  'link',\r\n  'upload',\r\n  'edit-mode',\r\n  {\r\n    name: 'more',\r\n    toolbar: ['insert-after', 'fullscreen', 'preview']\r\n  }\r\n];\r\n```\r\n\r\n### 目录配置\r\n\r\n```javascript\r\nconst options = {\r\n  outline: {\r\n    enable: true,\r\n    position: 'left' // 可选: left、right\r\n  }\r\n};\r\n```\r\n\r\n### 计数器配置\r\n\r\n```javascript\r\nconst options = {\r\n  counter: {\r\n    enable: true,\r\n    max: 10000,\r\n    type: 'markdown' // 可选: markdown、text\r\n  }\r\n};\r\n```\r\n\r\n### 历史记录配置\r\n\r\n```javascript\r\nconst options = {\r\n  undoDelay: 5000 // 历史记录间隔（毫秒）\r\n};\r\n```\r\n\r\n### 快捷键配置\r\n\r\n```javascript\r\nconst options = {\r\n  tab: '\\t' // Tab 键操作字符串\r\n};\r\n```\r\n\r\n## 🎯 常见用法\r\n\r\n### 基础编辑器\r\n\r\n```vue\r\n<VueVditor v-model=\"content\" height=\"500px\" />\r\n```\r\n\r\n### 深色主题\r\n\r\n```vue\r\n<VueVditor v-model=\"content\" :options=\"{ theme: 'dark' }\" />\r\n```\r\n\r\n### 禁用编辑器\r\n\r\n```vue\r\n<VueVditor\r\n  v-model=\"content\"\r\n  :disabled=\"true\"\r\n  @after=\"handleAfter\"\r\n/>\r\n```\r\n\r\n### 获取内容并保存\r\n\r\n```javascript\r\nconst saveContent = () => {\r\n  if (editor) {\r\n    const markdown = editor.getValue();\r\n    // 发送到服务器\r\n    api.save(markdown);\r\n  }\r\n};\r\n```\r\n\r\n### 监听内容变化\r\n\r\n```javascript\r\nconst handleInput = (value) => {\r\n  console.log('内容变化:', value);\r\n};\r\n```\r\n\r\n### 主题切换\r\n\r\n```javascript\r\nconst toggleTheme = () => {\r\n  if (editor) {\r\n    const currentTheme = editor.vditor.options.theme;\r\n    const newTheme = currentTheme === 'dark' ? 'classic' : 'dark';\r\n    editor.setTheme(newTheme);\r\n  }\r\n};\r\n```\r\n\r\n### 插入指定内容\r\n\r\n```javascript\r\nconst insertAtCursor = () => {\r\n  if (editor) {\r\n    editor.insertValue('```javascript\\nconsole.log(\"Hello\");\\n```');\r\n  }\r\n};\r\n```\r\n\r\n### 获取选中内容\r\n\r\n```javascript\r\nconst getSelection = () => {\r\n  if (editor) {\r\n    const selection = editor.getSelection();\r\n    console.log('选中内容:', selection);\r\n  }\r\n};\r\n```\r\n\r\n## 🔧 本地开发\r\n\r\n```bash\r\n# 克隆项目\r\ngit clone https://gitee.com/banyunjian/vue3-vditor.git\r\ncd vue3-vditor\r\n\r\n# 安装依赖\r\nnpm install\r\n\r\n# 启动开发服务器\r\nnpm run dev\r\n\r\n# 构建库\r\nnpm run build\r\n\r\n# 预览构建结果\r\nnpm run serve\r\n```\r\n\r\n### 开发服务器地址\r\n启动后访问：http://localhost:3000\r\n\r\n## 📦 构建\r\n\r\n```bash\r\n# 构建生产版本\r\nnpm run build\r\n\r\n# 构建并发布（使用 standard-version）\r\nnpm run release\r\n```\r\n\r\n构建产物位于 `lib/` 目录：\r\n\r\n- `index.umd.js` - UMD 格式（支持浏览器全局变量）\r\n- `index.mjs` - ES Module 格式\r\n\r\n## 🤝 贡献指南\r\n\r\n欢迎贡献代码！请遵循以下步骤：\r\n\r\n1. Fork 本仓库\r\n2. 创建特性分支 (`git checkout -b feature/AmazingFeature`)\r\n3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)\r\n4. 推送到分支 (`git push origin feature/AmazingFeature`)\r\n5. 开启 Pull Request\r\n\r\n### 提交规范\r\n\r\n本项目使用 [Conventional Commits](https://www.conventionalcommits.org/) 规范：\r\n\r\n- `feat:` 新功能\r\n- `fix:` 修复 bug\r\n- `docs:` 文档更新\r\n- `style:` 代码格式调整\r\n- `refactor:` 代码重构\r\n- `perf:` 性能优化\r\n- `test:` 测试相关\r\n- `chore:` 构建/工具相关\r\n\r\n## 📄 License\r\n\r\nMIT License\r\n\r\n## 🙏 致谢\r\n\r\n- [Vditor](https://b3log.org/vditor/) - 强大的 Markdown 编辑器\r\n- [vue-vditor](https://github.com/BWrong/vue-vditor) - Vue 2/3兼容的 vditor组件\r\n- [Vue](https://vuejs.org/) - 渐进式 JavaScript 框架\r\n- [vue-demi](https://github.com/vueuse/vue-demi) - Vue 2/3 兼容层\r\n\r\n## 🔗 相关链接\r\n\r\n- [Vditor 官方文档](https://ld246.com/article/1549638745630)\r\n- [Vditor GitHub](https://github.com/Vanessa219/vditor)\r\n- [Vue.js 官网](https://vuejs.org/)\r\n- [在线预览](https://ld246.com/guide/markdown)","readmeFilename":"README.md"}