520hacker / vue-markdown-editor

A markdown editor built on Vue

Markdown Editor built on Vue3

Links

• Demo
• Documentation
• 中文文档
• 国内文档镜像
• Changelog

Communication

qq group: 798884474

Install

# use npm
npm i @kangc/v-md-editor@next -S

# use yarn
yarn add @kangc/v-md-editor@next

Quick Start

import { createApp } from 'vue';
import App from 'App.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';

VueMarkdownEditor.use(vuepressTheme);

createApp(App).use(VueMarkdownEditor);

Usage

<script setup>
  import { ref } from 'vue';

  const text = ref('');
</script>

<template>
  <v-md-editor v-model="text" height="400px"></v-md-editor>
</template>

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