请安装以下插件

le-markdown-editor: 一个vue的markdown编辑器组件，在支持常规markdown语法的基础上添加了图片上传、多主题切换、流程图支持和一系列便捷的功能，演示地址：http://47.100.125.98 (gitee.com)

npm i le-markdown-editor --save

配置

1、在main.js中，对组件进行引入

import leMarkdownEditor from 'le-markdown-editor'

Vue.use(leMarkdownEditor)

2、在想要展示markdown文件的地方写入组件

 <le-preview ref="md-preview" :is-md="true" :value="value" :hljs-css="hljsCss"></le-preview>

3、在data中进行如下配置

const md = require('./sql.md') 
export default {
    data() {
      return {
        hljsCss: 'agate',
        value: md
      }
    },

注意所展示的md文件路径

4、配置webpack.base.conf.js

在module中的rules增加一个配置规则

 {
     test: /\.md$/,
     use: ["text-loader"]
 }