先放项目地址: https://github.com/wxsms/vue-md-loader
其实类似的 loader 已经有了。做这个是为了解决一个突出的问题:Vue 相关项目文档的代码示例。
比如说这样的一个 Markdown 文件: https://github.com/wxsms/uiv/blob/master/docs/pages/components/Alert.md
要变成为这样的一个文档页面:https://uiv.wxsm.space/alert/
要实现同样的示例代码不用写两份,最理想的方案应该是直接通过 loader 解决。于是就有了这个轮子。
工作原理是:它可以将 Markdown 中需要实例化的 CodeBlocks 通过一定规则打包成独立的 Vue 组件,最后再将整个 Markdown 打包为父组件,这样就可以直接交给 vue-loader
加载了。
除此以外它也具备了其它的常用功能,如代码高亮,插件加载等。
使用方法:
module.exports = {
// ...
module: {
rules: [
// ...
{
test: /\.md$/,
loader: 'vue-loader!vue-md-loader'
}
]
}
}
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.