vue-markdown-loader
Convert Markdown file to Vue Component using markdown-it.
Example
Live demo
https://glitch.com/edit/#!/vue-markdown
Installation
# For Vue1 npm i vue-markdown-loader@0 -D # For Vue2 npm i vue-markdown-loader -D
Feature
- Hot reload
- Write vue script
- Code highlight
Usage
webpack.config.js
file:
moduleexports = module: rules: test: /\.md$/ loader: 'vue-markdown-loader' ;
Options
preventExtract
Since v2.0.0
, this loader will automatically extract script and style tags from html token content (#26). If you do not need, you can set this option
test: /\.md$/ loader: 'vue-markdown-loader' options: preventExtract: true
wrapper
You can customize wrapper tag no matter html element tag or vue component tag. Default is 'section'
test: /\.md$/ loader: 'vue-markdown-loader' options: wrapper: 'article'
markdownIt
reference markdown-it
module: rules: test: /\.md$/ loader: 'vue-markdown-loader' options: // markdown-it config preset: 'default' breaks: true { // do any thing return source } use: /* markdown-it plugin */ /* or */ 'this is options'
Or you can customize markdown-it
var markdown = html: true breaks: true markdown ; moduleexports = module: rules: test: /\.md$/ loader: 'vue-markdown-loader' options: markdown ;
Add Vue configuration
var webpack = ; moduleexports = module: rules: test: /\.md$/ loader: 'vue-markdown-loader' plugins: vue: {} ;
License
WTFPL