如果我在GitHub存储库中有一个。html文件,例如运行一组JavaScript测试,有什么方法可以直接查看该页面,从而运行测试?
例如,我是否可以看到jQuery测试套件生成的测试结果,而不需要下载或将repo复制到本地驱动器并在那里运行?
我知道这基本上会把GitHub放在静态内容托管业务中,但话又说回来,他们只需要改变他们的mime类型从文本/纯文本/html。
如果我在GitHub存储库中有一个。html文件,例如运行一组JavaScript测试,有什么方法可以直接查看该页面,从而运行测试?
例如,我是否可以看到jQuery测试套件生成的测试结果,而不需要下载或将repo复制到本地驱动器并在那里运行?
我知道这基本上会把GitHub放在静态内容托管业务中,但话又说回来,他们只需要改变他们的mime类型从文本/纯文本/html。
当前回答
如果你在github中有一个angular或react项目,你可以使用https://stackblitz.com/在浏览器中在线运行应用程序。
输入您的Github用户名和存储库名称以在线查看应用程序stackblitz.com/github/{GITHUB_USERNAME}/{REPO_NAME}
即使没有将Node_Modules上传到Github,这也可以工作
目前支持使用@angular/cli和create-react-app的项目。对Ionic, Vue和自定义webpack配置的支持即将到来!
其他回答
这是一个小Greasemonkey脚本,将添加一个CDN按钮的html页面上的github
目标页面的格式为:https://cdn.rawgit.com/user/repo/master/filename.js
// ==UserScript==
// @name cdn.rawgit.com
// @namespace github.com
// @include https://github.com/*/blob/*.html
// @version 1
// @grant none
// ==/UserScript==
var buttonGroup = $(".meta .actions .button-group");
var raw = buttonGroup.find("#raw-url");
var cdn = raw.clone();
cdn.attr("id", "cdn-url");
cdn.attr("href", "https://cdn.rawgit.com" + cdn.attr("href").replace("/raw/","/") );
cdn.text("CDN");
cdn.insertBefore(raw);
Github有一个名为Github pages的静态页面托管服务,你可以在设置下找到它,然后选择页面,并选择你想要为页面使用的分支并点击保存。
我的项目Ratio.js也遇到了同样的问题,下面是我所做的。
问题: Github.com通过将内容类型/MIME设置为纯文本来防止文件在查看源代码时呈现/执行。
解决方案: 使用网页导入文件。
例子:
使用jsfiddle.net或jsbin.com在线创建一个网页,然后保存它。 在Github.com中导航到您的文件,并单击“raw”按钮以获得文件的直接链接。 从那里,使用适当的标记和属性导入文件。
<!DOCTYPE>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css" type="text/css" media="screen" />
</head>
<body>
<h1 id="qunit-header">QUnit example</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup, will be hidden</div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="http://code.jquery.com/qunit/git/qunit.js"></script>
<script type="text/javascript" src="https://raw.github.com/LarryBattle/Ratio.js/master/src/Ratio.js"></script>
<script type="text/javascript" src="https://raw.github.com/LarryBattle/Ratio.js/master/tests/js/Ratio-testcases.js"></script>
</body>
</html>
现场演示: http://jsfiddle.net/jKu4q/2/
注意:对于jsfiddle.net,您可以通过在url末尾添加show来直接访问结果页面。 像这样:http://jsfiddle.net/jKu4q/2/show
还是……你可以创建一个项目页面,并从那里渲染你的HTML文件。 您可以在http://pages.github.com/上创建一个项目页面。
创建完成后,您可以通过http://*accountName*.github.com/*projectName*/访问该链接 例如:http://larrybattle.github.com/Ratio.js/
你可以分支gh-pages来运行你的代码或尝试这个扩展(Chrome, Firefox): https://github.com/ryt/githtml
如果你需要的是测试,你可以将JS文件嵌入到: http://jsperf.com/
根据@niutech的回答,你可以做一个非常简单的书签片段。 使用Chrome,不过它在其他浏览器上的工作原理类似
右击书签栏 单击“添加文件” 把它命名为类似Github HTML的东西 对于URL类型javascript:top.location="http://htmlpreview.github.com/?"+document.URL 当你在一个github文件视图页面(不是raw.github.com)点击书签链接,你是黄金。