vue项目中要实现展示markdown文件[转载]

转载

版权声明：本文为CSDN博主「齐天二圣」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/nihaoa50/article/details/83744989

1）安装npm install text-loader --save

2）在webpack.base.config.js中添加

    {

        test: /.md$/,

        loader: ‘text-loader’

    }

然后通过import READMD from ‘./README.md’，即可正确获取.md文件中的md原始内容。

3）安装md解析器如vue-markdown，npm install vue-markdown --save

vue文件代码如下：

<template>

    <div>

        <h1>document</h1>

        <vue-markdown>{{msg}}</vue-markdown>

    </div>

</template>

<script>

import VueMarkdown from 'vue-markdown';

import README from './README.md';

export default {

    name:'document',

    components:{

        VueMarkdown

    },

    data(){

        return{

            msg:README

        }

    },

    methods:{

    }

}

</script>