module.exports = {
chainWebpack: config => {
config.module
.rule(‘md‘)
.test(/.md$/)
.use(‘html-loader‘)
.loader(‘html-loader‘)
.end()
.use(‘markdown-loader‘)
.loader(‘markdown-loader‘)
.end()
}
}
这是 vue.config.js 配置方法
需要安装的依赖:
cnpm i html-loader markdown-loader --save-dev
文件里使用
import demo from "../../assets/demo.md";
console.log(demo)
export default {
data() {
return {
md:demo
};
}
};
// 这里可以约束解析出来后的 markdown 标签样式,如设置 h3{...}
如果不配置 md loader ,引入demo.md 后 的console.log() 输出的是一个vue模板解析对象(vue-loader处理后的对象)。 配置后输出的是 将 md 语法解析后的 html 字符串
原文:https://www.cnblogs.com/winyh/p/11934129.html