菜鸟科技网

showdown命令如何使用?

showdown 是一个非常流行的 JavaScript 库,它可以将 Markdown 格式的文本转换成 HTML,它不仅可以在浏览器端运行,也可以在 Node.js 环境中使用。

showdown命令如何使用?-图1
(图片来源网络,侵删)

showdown 的核心功能通过命令行工具(showdown 命令)和 JavaScript API 两种方式提供,这里我们重点讲解 命令行工具 的使用。


安装

在使用 showdown 命令之前,你需要先安装 Node.js 和 npm (Node Package Manager),通过 npm 全局安装 showdown

打开你的终端(Terminal 或 Command Prompt),运行以下命令:

npm install -g showdown
  • -g 标志表示全局安装,这样你可以在任何地方使用 showdown 命令,而无需进入特定项目目录。

安装完成后,你可以通过以下命令验证是否安装成功:

showdown命令如何使用?-图2
(图片来源网络,侵删)
showdown --version

如果输出版本号,说明安装成功。


基本用法

showdown 命令的基本语法结构如下:

showdown <command> [options]

最常用的命令是 make,用于将 Markdown 转换为 HTML。

从文件读取 Markdown 并输出到控制台

这是最常见的用法,假设你有一个名为 README.md 的 Markdown 文件。

showdown命令如何使用?-图3
(图片来源网络,侵删)
# 语法
showdown make <你的markdown文件名>
# 示例
showdown make README.md

执行后,转换后的 HTML 代码会直接打印在你的终端(控制台)中。

从文件读取,并保存到 HTML 文件

使用 --output-o 选项来指定输出文件的路径。

# 语法
showdown make <你的markdown文件名> --output <你的html文件名>
# 示例
showdown make README.md --output index.html

这条命令会读取 README.md 的内容,将其转换为 HTML,并将结果保存到当前目录下的 index.html 文件中。

从标准输入读取

你可以通过管道()将其他命令的输出或直接输入的内容作为 showdown 的输入。

# 示例:直接在命令行输入 Markdown 并转换
echo "# Hello, Showdown!" | showdown make
# 示例:将另一个文件的内容通过管道转换
cat another_markdown.md | showdown make

常用选项

showdown 提供了许多有用的选项来控制转换行为,以下是一些最常用的选项:

选项 简写 描述
--output -o 指定输出文件-o output.html
--input -i 指定输入文件,当输入不是最后一个参数时使用。
--version -v 显示 showdown 的版本号。
--help -h 显示帮助信息。
--extension -e 加载扩展,可以加载一个或多个扩展,用逗号分隔。-e footnotes,emoji
--no-header-footer 不在输出 HTML 中添加 <html>, <head>, <body> 等标签,只输出转换后的内容。
--tables 启用表格支持,这是默认开启的,但可以用来关闭它(配合 --no-tables)。
--smart 启用 "smart" 标点符号转换(将 转为 )。
--metadata 从 Markdown 文件头部提取元数据(YAML front matter)。
--open 转换完成后,用默认浏览器打开生成的 HTML 文件。

实战示例

假设我们有以下 Markdown 文件 post.md

--- 我的第一篇博客
author: 张三
---
# 这是一个标题
这是一个段落,包含**粗体**和*斜体*。
## 列表
- 苹果
- 香蕉
- 橙子
## 表格
| 姓名 | 年龄 | 职业 |
| :--- | :--: | ---: |
| 李四 | 28   | 工程师 |
| 王五 | 32   | 设计师 |
> 这是一个引用块。

示例 1:基本转换

showdown make post.md

输出 (控制台):

<html>
<head>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落,包含<strong>粗体</strong>和<em>斜体</em>。</p>
<h2>列表</h2>
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>橙子</li>
</ul>
<h2>表格</h2>
<table>
<thead>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>职业</th>
</tr>
</thead>
<tbody>
<tr>
<td>李四</td>
<td align="center">28</td>
<td align="right">工程师</td>
</tr>
<tr>
<td>王五</td>
<td align="center">32</td>
<td align="right">设计师</td>
</tr>
</tbody>
</table>
<blockquote>
<p>这是一个引用块。</p>
</blockquote>
</body>
</html>

示例 2:只转换内容,不添加 HTML 标签

showdown make post.md --no-header-footer

输出 (控制台):

<h1>这是一个标题</h1>
<p>这是一个段落,包含<strong>粗体</strong>和<em>斜体</em>。</p>
<h2>列表</h2>
<ul>
<li>苹果</li>
<li>香蕉</li>
<li>橙子</li>
</ul>
...
<!-- 省略了 <html>, <head>, <body> 等标签 -->

示例 3:使用扩展并自动打开文件

showdown 默认不包含高亮代码的扩展,但我们可以使用一个流行的社区扩展 showdown-highlight

  1. 安装扩展

    npm install -g showdown-highlight
  2. 使用扩展转换并打开 假设 post.md 中包含代码块:

    ```javascript
    console.log('Hello, world!');
    
    运行命令:
    ```bash
    showdown make post.md -e highlight -o post.html --open
    • -e highlight: 加载 highlight 扩展,用于代码高亮。
    • -o post.html: 输出到 post.html
    • --open: 转换完成后,用浏览器打开 post.html

高级用法:配置文件

如果你有很多自定义选项不想每次都输入,可以创建一个配置文件,在项目根目录下创建一个名为 .showdownrc 的文件(可以是 JSON 或 YAML 格式)。

JSON 格式 (.showdownrc):

{
  "extensions": ["footnotes", "emoji"],
  "omitExtraWLInCodeBlocks": true,
  "simplifiedAutoLink": true,
  "tables": true,
  "tasklists": true
}

YAML 格式 (.showdownrc):

extensions:
  - footnotes
  - emoji
omitExtraWLInCodeBlocks: true
simplifiedAutoLink: true
tables: true
tasklists: true

创建配置文件后,你只需要运行简单的命令即可应用所有配置:

showdown make README.md

showdown 会自动读取并应用 .showdownrc 中的设置。


showdown 命令是一个强大且灵活的工具,非常适合在开发工作流中快速预览 Markdown、生成静态 HTML 页面或构建文档站点。

核心要点回顾:

  1. 安装: npm install -g showdown
  2. 基本转换: showdown make input.md -o output.html
  3. 常用选项: -o (输出), -e (扩展), --no-header-footer (简洁输出)
  4. 进阶功能: 通过管道、--open 和配置文件(.showdownrc)来提升效率。
分享:
扫描分享到社交APP
上一篇
下一篇