Markdown Editor built on Vue

Links

• Demo
• Documentation
• 中文文档
• Changelog

Communication

qq group: 798884474

Install

# Vue 2 use npm
npm i @kangc/v-md-editor -S
# Vue 2 use yarn
yarn add @kangc/v-md-editor

Vue 3 use npm
npm i @kangc/[email protected] -S
Vue 3 use yarn
yarn add @kangc/[email protected]

Quick Start

import Vue from 'vue';
import VueMarkdownEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';

// Prism
import Prism from 'prismjs';
// highlight code
import 'prismjs/components/prism-json';
VueMarkdownEditor.use(vuepressTheme, {
  Prism,
});
Vue.use(VueMarkdownEditor);

Quick Start In Vue3

import { createApp } from 'vue';
import VMdEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import vuepressTheme from '@kangc/v-md-editor/lib/theme/vuepress.js';
import '@kangc/v-md-editor/lib/theme/style/vuepress.css';

// Prism
import Prism from 'prismjs';
// highlight code
import 'prismjs/components/prism-json';
VMdEditor.use(vuepressTheme, {
  Prism,
});
const app = createApp(/.../);
app.use(VMdEditor);

Usage

Usage Composition Api

Sponsor

Paypal

PayPal.Me

Alipay 支付宝

WeChat Pay 微信

Refrence

• ElementUi Utils clickoutside
• ElementUi Utils resize-event
• ElementUi Utils scrollbar-width
• ElementUi Scrollbar Component
• vuepress-plugin-container
• vuepress markdown preWrapper
• vuepress markdown link
• markdown-it-katex
• markdown-it-table-of-contents
• markdown-it-task-lists

License

MIT