在浏览器刷新时自动将 Markdown 转换为 html答案

【问题标题】：Automatically convert markdown to html on browser refresh在浏览器刷新时自动将 Markdown 转换为 html
【发布时间】：2013-05-20 21:25:34
【问题描述】：

这次，Paul Irish 在 googleio 2013 期间对网络工具给出了一些惊人的见解。因此，他展示了一些幻灯片，这些幻灯片已从 markdown 源（即 .md 文件）解析为 html。

但让我感到惊讶的是，当他在 chrome 开发工具源面板中编辑幻灯片的源标记，然后点击刷新时，.md 自动再次编译成 html 以在浏览器上输出。现在我知道他在chrome开发工具中对markdown文件所做的更改也是在他保存在计算机上的本地文件上进行的，但是markdown文件是如何在保存和刷新浏览器时自动转换为html文件的呢？

我是markdown 的初学者，我真的很想拥有这个功能。任何帮助都深表感谢

【问题讨论】：

正是我很想知道他如何在保存时从markdown源生成html，而无需编译它或从终端输入任何内容。他只是保存文件并刷新浏览器。是否有一些 javascript 库可以做到这一点？我希望我把自己说清楚了@yvtty，如果这个问题看起来模棱两可，我很抱歉。
你有没有试过问保罗爱尔兰人？您的问题显然很老，所以他今天可能甚至都不记得了，但是他的解决方案/工具可能比看起来要简单得多...

标签： html automation markdown googleio

【解决方案1】：

markdown 的全部目的是它既是人类可读的，也是机器可读的。它被设计转换为 HTML。

根据您使用的语言，有一些 Markdown 解析器可以为您创建 HTML。

例如，for PHP。

因此，例如，要让您的服务器显示 homepage.md 的内容，您的 index.php 文件可能具有以下内容：

$filename = $_GET['file'];
$content  = markdown( file_get_contents( "path_to_markdown/{$filename}.md" ) );
print $content;

而且，要在浏览器中查看它，您可以转到 example.com/?file=homepage

【讨论】：

感谢您的回复 @DannyB ，我知道 Markdown 旨在被解析为 HTML。但我更感兴趣的是他在这种情况下如何自动实现这一点。他只是在 chrome 开发工具中修改了 markdown 源并将其保存，然后在刷新浏览器时，更改会反映在 html 代码中。这是怎么回事？
好吧，我不在场，所以无法对此发表评论。但是，除了让您的服务器读取 Markdown 文件并因此显示 HTML 的能力之外，您还在寻找什么？
我只希望每当我的 markdown 文件被修改时，相应的 HTML 输出也应该被自动修改，而我不必再次编译 .md 文件以生成所需的输出每次修改。我真的不在乎这是否发生在客户端或服务器端。我只想在修改 .md 文件时自动进行转换。
为什么需要编译markdown的硬版本？即时阅读。如果您确实想在操作系统中的文件更改时采取措施，那么这是一个不同的问题，取决于您的操作系统。您将放置一个监视文件更改并调用该迷你编译的进程（它会做同样的事情 - 只需获取该 md，将其放入解析器并保存输出）。
非常感谢您编辑的解决方案@DannyB！请原谅我的措辞，我同意你的观点，阅读文件上的 .md 文件效率更高。

【解决方案2】：

我会尽力回答这个问题。

HTML Mark down 是一种简写语法，可以由网络浏览器解释以格式化或呈现 html 页面。

这取自堆栈溢出。例如

语法基于电子邮件程序的方式通常做报价单。你不需要硬包装你的块引用中的段落，但如果你这样做看起来会更好。取决于你的懒惰程度。

因此，就像从记事本 ++ 中的文件从文本转换为 html 一样。该文件将使用该特定语法的基本规则进行格式化。

还必须记住，程序不是读心者。如果降价代码无效，则相应的 html 代码也无效。就像保存“应该”以 html 格式设置的文本文件一样。如果语法不正确，它将不会保存为工作 html 文件。

此外，markdown 并不是真正代码的完全替代品。它无法涵盖真正编码语言的广度和深度。我可以把它比作伪代码，但这更像是一个横向的例子。

在回答您的最新评论时，如果第二个文件是从第一个文件创建的（并且格式已更改）-（在这种情况下从标记到 html）-如果随后编辑第一个文件，而不覆盖更改到第二个文件中，它不能期望被更改。

这是一个 SO 给我的很好的链接：

https://stackoverflow.com/editing-help

如果我有错误，请随时编辑。

【讨论】：

非常感谢@yvytty 的帮助，但我明白什么是降价。想象一下，您有一个 markdown 文件，您使用 markdown 或其他编译器对其进行编译，以生成相应的 html，并将其包含在本地托管的网页中（假设）。如果您编辑 markdown 文件中的一些代码，我想这些更改将不会在浏览器中自动显示，因为您还没有真正将新的 .md 文件编译到 html 文件中。因此，在对源降价进行任何修改后，您将不得不一遍又一遍地执行此操作。我想自动实现这个
你说的完全正确。如果降价中有一些错误，我将无法获得所需的 html。然而，我对阅读 Markdown 文件并动态解析它们更感兴趣。

【解决方案3】：

我没有为 Chrome 尝试过这个扩展，但它似乎会在 Chrome 中自动呈现 markdown (.md) 文件。

https://chrome.google.com/webstore/detail/markdown-preview/jmchmkecamhbiokiopfpnfgbidieafmd?hl=en

在 Firefox 中，我使用以下扩展来实现相同的功能。

https://addons.mozilla.org/en-US/firefox/addon/markdown-viewer/

不需要单独的 .html 文件，只需保存扩展名为 .md 的文本文件并在浏览器中打开即可。

希望对您有所帮助。

【讨论】：