一种基于Webpack解析含有Vue组件的Markdown的方法技术

本发明专利技术涉及一种基于Webpack解析含有Vue组件的Markdown的方法。本方法包括：基于Webpack编写自定义Markdown Loader，首先新建一个Loader文件夹，并在其目录下创建一个工具类index.js文件，然后通过npm安装markdown‑it插件，导出一个Vue组件结构代码；在Loader文件夹目录下新建一个config.js，然后使用npm安装markdown‑it‑container和markdow‑it‑chain插件，完成自定义Markdown Loader的构建；需要解析含有Vue组件的Markdown文件时，先通过npm安装上述的自定义Markdown Loader，然后更改根目录下vue.config.js的配置，引入编写的my‑markdown‑loader处理Markdown文件，最后执行打包构建命令。本方法能够快速解析Markdown文件并对其含有的Vue组件进行渲染，且只需引用一个Loader就可以同时执行解析和渲染的功能，操作流程简单，使用非常便捷。

【技术实现步骤摘要】

本专利技术属于markdown解析方法，尤其涉及一种基于webpack解析含有vue组件的markdown的方法。

技术介绍

1、在vue项目(基于vue.js框架的前端项目)开发中，在解析markdown文件(md文件)的时候，需要特定的markdown loader进行处理，但当markdown中的内容包含组件信息需要在html中渲染显示时，当前webpack提供的markdown loader并不具备满足该应用需求的相应功能，需要额外引用专门的loader组合才能够进行显示。

2、针对此问题，传统的处理方式主要有以下两种：方法一：通过markdown loader解析为html后，vue组件内容再利用vue loader进行处理；方法二：由专门编写的markdownloader统一解析和编译vue组件信息，然后渲染到页面上。上述处理方式均具有一定的不足，方法一的不足是webpack提供的loader功能单一，无法满足一些自定义的功能处理需求；方法二的不足是必须确保安装该自定义loader，配置过程比较复杂，需要改动原有的vue.confi本文档来自技高网...

【技术保护点】

1.一种基于Webpack解析含有Vue组件的Markdown的方法，其特征在于，所述方法包括：

2.根据权利要求1所述的基于Webpack解析含有Vue组件的Markdown的方法，其特征在于，步骤S2中所述的在Loader文件夹目录下新建的config.js中包含了对Markdown文件中Vue组件信息的解析操作。

3.根据权利要求2所述的基于Webpack解析含有Vue组件的Markdown的方法，其特征在于，所述的对Markdown文件中Vue组件信息的解析操作，包括：

4.根据权利要求3所述的基于Webpack解析含有Vue组件的Markdo...

【技术特征摘要】

1.一种基于webpack解析含有vue组件的markdown的方法，其特征在于，所述方法包括：

2.根据权利要求1所述的基于webpack解析含有vue组件的markdown的方法，其特征在于，步骤s2中所述的在loader文件夹目录下新建的config.js中包含了对markdown文件中vue组件信息的解析操作。

3.根据权利要求2所述的基于webpack解析含有vue组件的markdown的方法，其特征在于，所述的对markdown文件中vue组件...

【专利技术属性】
技术研发人员：陈俊如，沈杰，龚益，冯锦辉，叶圣强，耿惠莉，
申请(专利权)人：中电云计算技术有限公司，
类型：发明
国别省市：