Vue-markdown-view-hsfy NPM

Vue Editor

Demo

Install

npm install vue-md-editor --save

<script src="https://unpkg.com/vue-md-editor/dist/vue-editor.min.js"></script>

Usage

// main.js
import Vue from 'vue'
import VueEditor from 'vue-md-editor'

Vue.use(VueEditor)

new Vue({
  el: '#app',
  data: {},
  ...
})

<!--index.html-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>VueEditor example</title>
</head>
<body>
  <div id="app">
    <vue-editor v-model="value"></vue-editor>
  </div>
</body>
</html>

Dependencies

marked
highlight.js
If you want's to use highlight.js style.

Keyboards

Markdown	Result	Shortcut
text	text	Ctrl + B
_text_	text	Ctrl + I
### text	Heading	Ctrl + H
~~text~~	~~text~~	Ctrl + D
- text	List	Ctrl + U
1. text	List	Ctrl + O
[Demo](http://vue-editor.beblog.cn)	Demo	Ctrl + A
![Image](https://cn.vuejs.org/images/logo.png "Title")	Image	Ctrl + P
`text`\|`text` \| Ctrl + C
> text	Blockquote	Ctrl + Q