怎么在 vue 文件直接引入 markdown 进行解析
我想在 VersionLog.vue 文件 直接引入 markdown ,要怎么做，
在网上找的都是 markdown 编辑器，我不要那种的，我需要能直接解析掉，不用编辑器
VersionLog.vue
<template lang="html">
<div class="" id='editor'>
<!-- Log start -->
<div class="article" v-html="compiledMarkdown"></div>
<!-- Log end -->
</div>
</template>
<script>
import marked from 'marked'
export default {
name: 'Log',
data () {
return {
context: ""
}
},
computed:{
compiledMarkdown () {
return marked(this.context, { sanitize: true })
}
}
}
</script>
15 回复
1，如果你要自己对markdown 文本进行编译处理，可以直接使用text-loader； 2，如果你需要webpack直接帮你将markdown直接编译成html，可直接使用markdown-loader; 3，如果你需要2且编译后的html支持vue，可以使用vue-markdown-loader；
end……
x-cold 7楼 感谢！
1）安装npm install text-loader --save-dev
2）在webpack.config.js中添加
{
test: /.md$/,
loader: ‘text-loader’
}
然后通过import XXX from ‘xxx.md’，即可正确获取.md文件中的md原始内容。
3）安装md解析器如vue-markdown，npm install vue-markdown --save-dev
template:
<vue-markdown>{{msg}}</vue-markdown>
js:
import VueMarkdown from 'vue-markdown’
import xxx from 'XXX.md’
export default {
components: {
VueMarkdown
},
data () {
return {
msg: xxx
}
}
}
