在前端开发中，我们经常需要处理 Markdown 文件以获取其中的元数据信息。虽然可以手动解析这些数据，但是使用一个专门的工具来处理它们会更加方便和高效。front-matter 就是一个非常好用的 npm 包，它可以帮助我们轻松地从 Markdown 文件中提取出 YAML 格式的元数据，并将其转换为 JavaScript 对象。
安装与引入
要使用 front-matter，首先需要在项目中安装它：
npm install front-matter --save
然后，在需要使用的文件中引入它：
const fm = require('front-matter');基本使用
假设我们有一个包含 YAML 元数据的 Markdown 文件 post.md，内容如下：
--- title: "使用 front-matter" date: "2023-04-07" author: "ChatGPT" --- 这是一篇使用 front-matter 的示例文章。
我们可以使用以下代码来提取出其中的元数据：
-- -------------------- ---- ------- ----- -- - -------------- ----- ------- - -------------------------- -------- ----- ------ - ------------ ------------------------------- -- ---- ------ --- -------------- ----- ------------- ------- --------- - ------------------------- -- ------------ ------------ ---------
在上面的代码中，我们首先使用 fs 模块读取了 Markdown 文件的内容，然后将其传递给 front-matter 的 fm 函数进行解析。解析结果会包含两个属性：
attributes：一个 JavaScript 对象，包含了从 YAML 元数据中提取出来的键值对。body：一个字符串，表示 Markdown 文件中除了 YAML 元数据之外的部分。
高级用法
支持自定义解析器
front-matter 默认使用 js-yaml 包来解析 YAML 格式的元数据。如果你想要使用其他的 YAML 解析器，可以通过传递 options 参数来实现。例如，要使用 yaml 包来解析 YAML 格式的元数据，可以这样写：
const fm = require('front-matter');
const yaml = require('yaml');
const content = '---\nkey: value\n---\nSome content.';
const parsed = fm(content, { parser: yaml.parse });
console.log(parsed.attributes);
// 输出：{ key: 'value' }支持在元数据中使用 JSON
除了支持 YAML 格式的元数据之外，front-matter 还支持在元数据中使用 JSON 格式。只需要设置 options 参数中的 type 属性为 'json' 即可。
const fm = require('front-matter');
const content = '---\n{ "name": "Tom", "age": 18 }\n---\nSome content.';
const parsed = fm(content, { type: 'json' });
console.log(parsed.attributes);
// 输出：{ name: 'Tom', age: 18 }支持自定义分隔符
默认情况下，front-matter 使用 --- 作为 YAML 元数据的开始和结束标记。如果你想要使用其他的分隔符，可以通过设置 options 参数中的 delimiters 属性来实现。
const fm = require('front-matter');
const content = '[key: value]\nSome content.';
const parsed = fm(content, { delimiters: ['[', ']'] });
console.log(parsed.attributes);
// 输出：{ key: 'value' }总结
front-matter 是一个非常好用的工具，它可以帮助我们轻松地从 Markdown 文件中提取出 YAML 格式的元数据，并将其转换为 JavaScript 对象。在前端开发中，它可以被广泛地应用于博客、文档等项目中。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/41979