vue-md-loader
Advanced tools
Comparing version 0.1.4 to 0.2.0
{ | ||
"name": "vue-md-loader", | ||
"version": "0.1.4", | ||
"version": "0.2.0", | ||
"description": "Webpack loader for converting Markdown files to Vue components.", | ||
"main": "index.js", | ||
"nyc": { | ||
"reporter": [ | ||
"lcov", | ||
"text-summary" | ||
], | ||
"report-dir": "./test/coverage/" | ||
}, | ||
"scripts": { | ||
"dev": "cd example && webpack-dev-server --hot --inline --port 8888", | ||
"test": "mocha" | ||
"lint": "eslint --ext .js,.vue --config .eslintrc.js index.js src test/specs test/index.js example", | ||
"test": "nyc mocha", | ||
"coveralls": "cat test/coverage/lcov.info | ./node_modules/.bin/coveralls" | ||
}, | ||
@@ -35,3 +44,5 @@ "repository": { | ||
"babel-preset-es2015": "^6.24.1", | ||
"chai": "^4.1.2", | ||
"cheerio": "^1.0.0-rc.2", | ||
"coveralls": "^3.0.0", | ||
"css-loader": "^0.28.7", | ||
@@ -43,3 +54,3 @@ "eslint": "^4.9.0", | ||
"eslint-plugin-import": "^2.8.0", | ||
"eslint-plugin-jasmine": "^2.9.1", | ||
"eslint-plugin-mocha": "^4.11.0", | ||
"eslint-plugin-node": "^5.2.1", | ||
@@ -50,2 +61,3 @@ "eslint-plugin-promise": "^3.6.0", | ||
"mocha": "^4.0.1", | ||
"nyc": "^11.2.1", | ||
"style-loader": "^0.19.0", | ||
@@ -52,0 +64,0 @@ "vue": "^2.5.2", |
# vue-md-loader | ||
[](https://travis-ci.org/wxsms/vue-md-loader) | ||
[](https://coveralls.io/github/wxsms/vue-md-loader?branch=master) | ||
[](https://www.npmjs.com/package/vue-md-loader) | ||
@@ -202,2 +203,24 @@ [](https://github.com/wxsms/vue-md-loader) | ||
### preProcess | ||
Function. For example: | ||
```javascript | ||
preProcess: function(source) { | ||
// do anything | ||
return source | ||
} | ||
``` | ||
### afterProcess | ||
Function. For example: | ||
```javascript | ||
afterProcess: function(result) { | ||
// do anything | ||
return result | ||
} | ||
``` | ||
### live | ||
@@ -215,10 +238,10 @@ | ||
### liveTemplateProcessor | ||
### afterProcessLiveTemplate | ||
Function. Default: `null` | ||
Use this if you wish to change the live template manually (e.g. add wrappers). For example: | ||
Use this if you wish to change the live template manually after process (e.g. add wrappers). For example: | ||
```javascript | ||
function wrapIt (template) { | ||
afterProcessLiveTemplate: function(template) { | ||
return `<div class="live-wrapper">${template}</div>` | ||
@@ -225,0 +248,0 @@ } |
@@ -39,7 +39,9 @@ const MarkdownIt = require('markdown-it') | ||
livePattern: /<!--[\s]*?([-\w]+?).vue[\s]*?-->/i, | ||
liveTemplateProcessor: null, | ||
afterProcessLiveTemplate: null, | ||
markdown: Object.assign({}, DEFAULT_MARKDOWN_OPTIONS), // Markdown-It options | ||
rules: {}, // Markdown-It rules | ||
plugins: [], // Markdown-It plugins | ||
wrapper: 'section' // content wrapper | ||
wrapper: 'section', // content wrapper | ||
preProcess: null, | ||
afterProcess: null | ||
} | ||
@@ -120,4 +122,4 @@ // merge user options into defaults | ||
// Wrap it by options | ||
if (this.options.liveTemplateProcessor && typeof this.options.liveTemplateProcessor === 'function') { | ||
template = this.options.liveTemplateProcessor(template) | ||
if (this.options.afterProcessLiveTemplate && typeof this.options.afterProcessLiveTemplate === 'function') { | ||
template = this.options.afterProcessLiveTemplate(template) | ||
} | ||
@@ -217,5 +219,11 @@ // mount it to the live obj | ||
this.source = source | ||
if (this.options.preProcess && typeof this.options.preProcess === 'function') { | ||
this.source = this.options.preProcess(this.source) | ||
} | ||
let result = this.options.live ? this.parseLives() : {template: source, script: '', style: ''} | ||
let html = this.markdown.render(result.template) | ||
let vueFile = `<template><${this.options.wrapper}>${html}</${this.options.wrapper}></template>${result.style}${result.script}` | ||
if (this.options.afterProcess && typeof this.options.afterProcess === 'function') { | ||
vueFile = this.options.afterProcess(vueFile) | ||
} | ||
return vueFile | ||
@@ -222,0 +230,0 @@ } |
15276
221
265
26