vue-markdown-editor
v0.2.0
Published
A Vue.js markdown editor component.
Downloads
30
Readme
vue-markdown-editor
A Vue.js markdown editor component.
Usage
Install
npm install vue-markdown-editor
Dependencies
// Vue library
import Vue from 'vue'
// vue-validator
import VueValidator from 'vue-validator'
Vue.use(VueValidator)
// vue-transfer-dom
import VueTransferDom from 'vue-transfer-dom'
Vue.use(VueTransferDom)
vue-markdown-editor
JavaScript (ES6):
// load styling
import 'vue-markdown-editor/dist/vue-markdown-editor.css'
// load component
import { MarkdownEditor } from 'vue-markdown-editor'
// vue root instance example
new Vue({
el: '#app',
data () {
return {
content: null,
validator: null,
markedOptions: {
highlight: function (code) {
return require('highlight.js').highlightAuto(code).value
}
}
}
},
methods: {
submit () {
if (this.validator.valid) {
// do stuff
}
}
},
components: {
MarkdownEditor
}
})
Template:
<div id="app">
<form @submit.prevent="submit">
<div class="form-group" :class="{ 'has-error': validator && validator.content.invalid }">
<label for="content">Content</label>
<markdown-editor
:model.sync="content"
:validator.sync="validator"
:marked-options="markedOptions">
</markdown-editor>
<p class="help-block"
v-if="validator"
v-for="msg in validator.content.messages">
{{ msg }}
</p>
</div>
<div class="form-group">
<button type="submit" class="btn btn-success">Save</button>
</div>
</form>
</div>
Build
You can easily build vue-markdown-editor yourself.
Prerequisites
Our build tool of choice is Webpack. You should have webpack installed globally:
npm install -g webpack
And the build dependencies:
npm install
Build
Any of the following will create the files dist/vue-markdown-editor.js and dist/vue-markdown-editor.css.
Production build
Includes minification and several optimizations:
npm run build
Development build
A faster build suited for development, with no optimizations and without minification:
npm run build-dev
Watch
Start an initial development build and then FAST continuous incremental builds:
npm run dev