vue展示md文件，前端读取展示markdown文件

方案1:每次都需要重新打包，每次修改都需要build

直接使用require + v-html；核心代码如下：1. 首先需要添加MD文件的loader就是 Markdown-loader

npm install –sava Markdown-loader

2. 然后require加载对应的资源,也可以通过ajax获取资源对象

this.htmlMD = require(‘./xxx.md’);

或

axios.get(url).then((response) => {

this.htmlMD = response.data;

});

3. 最后通过v-html展示在对应的结构块即可

方案2: 直接读取static静态资源MD文件

1. 首先下载 vue-loader 和 vue-Markdown 组件npm install –sava Markdown-loader vue-Markdown2. 然后获取对应的资源对象 const url = ./xxx.md; axios.get(url).then((response) => { this.htmlMD = response.data; });3. 最后在 vue-Markdown 组件上展示即可，记得在 components 上先导入　3. 最后在 vue-Markdown 组件上展示即可，记得在 components 上先导入

还有一个最重要的代码部曾经忘记写了，现在补充上

// 拉取该文件夹下所有文件信息const filesMD = require.context(‘@/../static/xxxxMD’, true, /\.md$/);const filesMDNames = filesMD.keys();const tmepListDatas = [];filesMDNames.map((item) => {const listObj = {}; const listItemS = item.split(‘/’); if (listItemS.length > 0) { listObj.name = listItemS[1].replace(‘.md’, ”); listObj.path = item; listObj.children = []; listObj.showChild = false; }

return tmepListDatas.push(listObj);});