vue显示md文件
vue显示md文件环境搭建<1>安装依赖库cnpm i markdown-loader html-loader --savecnpm i showdown --save<2>build/webpack.base.conf.js添加{test: /\.md$/,use: [{ loader: 'htm...
·
vue显示md文件
环境搭建
<1>安装依赖库
cnpm i markdown-loader html-loader --save
cnpm i showdown --save
<2>build/webpack.base.conf.js添加
{
test: /\.md$/,
use: [
{ loader: 'html-loader' },
{ loader: 'markdown-loader', options: {} }
]
}
<3>main.js添加函数
import showdown from 'showdown'
Vue.prototype.md2html = (md)=> {
let converter = new showdown.Converter()
let text = md.toString()
let html = converter.makeHtml(text)
return html
}
页面中显示md文件
<1>导入需要的md文件, 注意需要添加后缀名
import readme from '../../README.md'
<2>data定义变量
data(){
return {
readme:this.md2html(readme)
}
}
<3>在模板中显示md文件
<div v-html="readme">
更多推荐
已为社区贡献1条内容
所有评论(0)