markdown-it-vanilla-loader 是一款用于在 Webpack 项目中加载 Markdown 文件并将其转化为 HTML 的 npm 包。本教程将会介绍这个包的使用方法。
安装
使用 npm 安装 markdown-it-vanilla-loader：
npm i markdown-it-vanilla-loader --save-dev
配置
修改 Webpack 配置文件，添加以下代码：
-- -------------------- ---- ------- -------------- - - ------- - ------ - - ----- -------- ---- - - ------- ------------- -- - ------- ---------------------------- - - - - - --展开代码
这段代码告诉 Webpack 当遇到 .md 后缀的文件时，使用 html-loader 将转化后的 HTML 代码嵌入到 JavaScript 中，再使用 markdown-it-vanilla-loader 将 Markdown 文件转化为 HTML。
用法
在 Javascript 文件中引入 Markdown 文件：
import text from './example.md'; document.body.innerHTML = text;
这将会将 example.md 文件的内容渲染为 HTML 并插入到页面中。
选项
markdown-it-vanilla-loader 提供了一些选项，可以用于调整转化后的 HTML 格式。
- 选项名称：
breaks- 类型：
boolean - 默认值：
false - 描述：允许在 Markdown 中使用换行符表示换行
- 类型：
-- -------------------- ---- ------- -------------- - - ------- - ------ - - ----- -------- ---- - - ------- ------------- -- - ------- ----------------------------- -------- - ------- ---- - - - - - - --展开代码
以上就是 markdown-it-vanilla-loader 的基本用法和选项配置，希望对你的前端开发工作有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/77042
