在提交到github之前，如何测试readme.md文件的外观？

我正在以.md格式为我的github项目编写自述文件。在提交到github之前，有没有办法测试我的readme.md文件的外观

很多方法：如果你在Mac电脑上，使用

---

如果您想在浏览器中进行测试，您可以尝试，正如@Aaron所指出的，或者因为现在似乎已经关闭了。就我个人而言，我使用Dillinger，因为它可以工作并将我的所有文档保存在浏览器的本地数据库中。

您可能想看看这个：

---

这一条已经被证明是可靠的：我通常直接在GitHub网站上编辑它，然后单击编辑窗口上方的“预览”

---

也许这是自本文发表以来新增的一项功能。

在web上，使用。这真是太棒了。

只需搜索网页，就可以得到以下信息：

---

这是一个相当古老的问题，但是因为我在搜索互联网时偶然发现了它，也许我的答案对其他人有用。 我刚刚发现了一个非常有用的CLI工具，用于呈现GitHub风格的标记：。它使用GitHub的API，因此渲染效果非常好

坦率地说，开发人员对这些非常相似的问题有一个更详细的答案：

---

我使用本地托管的HTML文件预览GitHub自述

我查看了几个现有选项，但决定推出自己的选项，以满足以下要求：

• 单个文件
• 本地托管（intranet）URL
• 不需要浏览器扩展
• 没有本地托管的服务器端处理（例如，没有PHP）
• 轻量级（例如，没有jQuery）
• 高保真度：使用GitHub渲染标记，并使用相同的CSS

我将GitHub存储库的本地副本保存在“GitHub”目录下的同级目录中

每个repo目录都包含一个README.md文件：

.../github/
           repo-a/
                  README.md
           repo-b/
                  README.md
           etc.

github目录包含“预览”HTML文件：

.../github/
           readme.html

要预览自述文件，我浏览github/readme.html，在查询字符串中指定repo：

http://localhost/github/readme.html?repo-a

http://localhost/github/repo-a/readme.html

或者，您可以将readme.html复制到与readme.md相同的目录中，并省略查询字符串：

http://localhost/github/readme.html?repo-a

http://localhost/github/repo-a/readme.html

如果readme.html与readme.md位于同一目录中，您甚至不需要通过HTTP提供readme.html：您可以直接从文件系统打开它

HTML文件使用在README.md文件中呈现标记。在撰写本文时，每小时有60个请求

在Windows7上的Chrome、IE和Firefox的当前生产版本中对我有效

来源 以下是HTML文件（readme.HTML）：

GitHub自述预览
// 0) {
readmeURL=queryString+“/”+自述文件名；
}否则{
readmeURL=自述文件名；
}
//获取标记，然后将其呈现为HTML
函数getThenRenderMarkdown（markdownURL）{
var xhr=new XMLHttpRequest（）；
open（“GET”，markdownhurl，true）；
xhr.responseType=“文本”；
xhr.onload=函数（e）{
if（this.status==HTTP\u status\u OK）{
//响应文本包含标记
renderMarkdown（this.responseText）；
}
}
xhr.send（）；
}
//使用GitHub API将标记呈现为HTML
函数renderMarkdown（markdown）{
var xhr=new XMLHttpRequest（）；
打开（“POST”，URL\u API\u GITHUB\u RENDER\u MARKDOWN，true）；
xhr.responseType=“html”；
xhr.onload=函数（e）{
if（this.status==HTTP\u status\u OK）{
document.getElementById（“自述文件”）.innerHTML=this.response；
}
}
发送（降价）；
}
window.onload=函数（）{
获取渲染标记（readmeURL）；
}
//]]>
GitHub自述预览
正在渲染标记，请稍候

渲染
,
按样式设置。

开发人员说明

• 通常情况下，我会在生活中包装我的代码，但在这种情况下，我不认为有必要，我认为应该保持简洁
• 我没有费心支持后台IE
• 为了简洁起见，我省略了错误处理代码（你相信我吗？！）
• 我欢迎JavaScript编程技巧

思想

• 我正在考虑为这个HTML文件创建一个GitHub存储库，并将该文件放在gh pages分支中，以便GitHub将其作为“普通”网页使用。我会调整文件以接受完整的URL（自述文件（或任何其他标记文件）作为查询字符串。我很好奇由GitHub托管是否会避开GitHub API请求限制，以及我是否会遇到跨域问题（使用Ajax请求从提供HTML页面的域以外的其他域获得降价）

---

原始版本（已弃用） 出于好奇，我保留了原始版本的记录。 此版本有以下问题，在当前版本中已解决：

• 它需要下载一些相关文件
• 它不支持与README.md放在同一个目录中
• 它的HTML更脆弱；更容易受到GitHub中更改的影响

github目录包含“预览”HTML文件和相关文件：

.../github/
           readme-preview.html
           github.css
           github2.css
           octicons.eot
           octicons.svg
           octicons.woff

我从GitHub下载了CSS和octicons字体文件：

https://assets-cdn.github.com/assets/github- ... .css
https://assets-cdn.github.com/assets/github2- ... .css
https://github.com/static/fonts/octicons/octicons.* (eot, woff, svg)

我重命名了CSS文件，以省略原始名称中十六进制数字的长字符串

我编辑了github.css以引用octicons字体文件的本地副本

我检查了GitHub页面的HTML，并复制了足够多围绕自述内容的HTML结构，以提供合理的逼真度；例如，受约束的宽度

GitHub CSS、octicons字体和自述内容的HTML“容器”都是移动目标：我需要定期下载新版本

我曾尝试过使用各种GitHub项目中的CSS。例如：

<link rel="stylesheet" type="text/css"
      href="http://rawgit.com/sindresorhus/github-markdown-css/gh-pages/github-markdown.css">

但最终决定使用GitHub本身的CSS

来源 以下是HTML文件（readme preview.HTML）：

预览GitHub自述文件
身体{
边缘顶部：1米；
}
//
自述文件
渲染降价

如果您