【问题标题】:Creating full html page with VSCode and marked使用 VSCode 创建完整的 html 页面并标记
【发布时间】:2016-11-29 21:15:46
【问题描述】:

我遵循了 VSCode 的 Compiling Markdown into HTML 教程。我设法用marked my.md -o my.html 创建了一个html 文件,但这个文件只包含我的markdown 的内容。我的意思是没有样式,没有html 和body 标签。 html 不完整。

你知道如何创建一个完整的 html 页面吗? github for marked 仅列出 -o 选项。它甚至可以呈现完整的 html 吗?

【问题讨论】:

  • 但它是否将段落渲染为 p-tags、带有 h1-6 标签的标题等等?

标签: html css markdown visual-studio-code javascript-marked


【解决方案1】:

Marked 只处理基本的 markdown 内容到 html 内容的转换,希望你自带文档和样式。你可以拼凑一个简单的节点脚本来处理这个:

// convertMd.js
var marked = require('marked')
var fs = require('fs')

const inFile = process.argv[2]
const outFile = process.argv[3]

const inputContent = fs.readFileSync(inFile, 'utf8')

const content = `<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
${marked(inputContent)}
</body>
</html>`

fs.writeFileSync(outFile, content)

tasks.json 的位置:

{
  // See http://go.microsoft.com/fwlink/?LinkId=733558
  //  for the documentation about the tasks.json format
  "version": "0.1.0",
  "command": "node",
  "isShellCommand": true,
  "args": ["./convertMd.js", "sample.md", "sample.html"],
  "showOutput": "always"
}

其他命令行工具可能会提供更完整的 html 输出。

【讨论】:

  • 经过一些试验和错误后,我设法运行了它,它就像一个魅力;-) 我需要仔细研究任务和节点脚本,因为目前我一个都不懂。我很难接受任何答案,因为它们都很有帮助。
【解决方案2】:

Markdown 呈现为 HTML 片段,而不是 HTML 文档。实际上。大多数 Markdown 解析器(包括原始参考实现)只输出 HTML 片段。

rules 部分状态:

HTML 是一种发布 格式; Markdown 是一种写作 格式。

将 HTML 片段包装在 &lt;html&gt; 和 &lt;body&gt; 标签中是发布,并且超出了 Markdown 的范围。将片段包装在文档模板中是您的责任。

在 Markdown 解析器中,有一些例外,但这些工具通常不仅仅是一个 Markdown 解析器。它们往往是发布平台,并且通常支持的不仅仅是 Markdown 。它们结合了 Markdown 解析、模板(Markdown 输出作为一个变量插入到模板中)和各种其他功能来创建一个完整的发布工具(例如,参见 Pandoc)。标记不是这样的工具。它只是一个 Markdown 解析器。但是,可能还有其他工具将标记包装为发布工具的一部分。或者,您可以构建自己的自定义解决方案(使用标记)以满足您的特定需求。

如果是这样,那么为什么 Marked(或任何其他 Markdown 解析器)会有命令行界面?因此,您可以将输出通过管道传输到其他工具。

【讨论】:

  • 哦,我不知道这种区别,它实际上很有意义。我想如果 VSCode 中的预览样式很好,但 html 输出不是,那么我做错了什么。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2012-10-18
  • 1970-01-01
  • 2016-08-23
  • 1970-01-01
  • 1970-01-01
  • 2022-06-28
  • 2013-05-12
相关资源
最近更新 更多