有谁知道可以监视一个或多个本地文件的Firefox扩展,脚本或其他某种机制。当Firefox在文件中检测到(时间戳)更改时,它将自动刷新或以其他方式更新其画布。
对于编辑CSS,理想的情况是仅重新加载CSS,而不是重新渲染完整的HTML。
实际上,仅通过外部文件,它就可以通过动态HTML / CSS编辑来实现与Firebug类似的行为。
Answers:
从网站:
怎么样?仅包含Live.js,它将通过向服务器发送连续的HEAD请求来监视当前页面,包括本地CSS和Javascript。对CSS的更改将动态应用,并且HTML或Javascript更改将重新加载页面。试试看!
哪里?除非另外证明,否则Live.js可以在Firefox,Chrome,Safari,Opera和IE6 +中运行。Live.js与您使用的开发框架或语言无关,无论它是Ruby,Handcraft,Python,Django,NET,Java,Php,Drupal,Joomla还是您所需要的。
与IETester一起使用具有巨大的好处,可以动态刷新每个打开的IE选项卡。
通过将以下内容添加到 <head>
<script type="text/javascript" src="http://livejs.com/live.js"></script>
Live.js doesn't support the file protocol. It needs http.
python -m SimpleHTTPServer
。
看看FileWatcher扩展:https : //addons.mozilla.org/en-US/firefox/addon/filewatcher/
免责声明:我是扩展名的作者;)
我会推荐livejs
但它具有以下优点和缺点
优点:
1.设置简单
2.在不同的浏览器上无缝运行(Live.js在Firefox,Chrome,Safari,Opera和IE6 +中运行)
3.不必添加烦人的间隔来刷新浏览器,特别是当您要调试和设计
4时。仅在保存更改时刷新ctrl + S
5.直接从firebug中保存CSS等我没有使用过该功能,但在其网站http://livejs.com/上阅读了他们也支持的功能!
缺点:
1.它不能在文件协议file:///C:/Users/Admin/Desktop/livejs/live.html
上运行2.您需要让服务器像这样运行它http://localhost
3.在临时/生产环境中部署时必须将其删除
4.不提供CDN我尝试作弊并应用直接链接http://livejs.com/live.js,但是您必须下载并保持本地运行才能正常使用。
Xrefresh与萤火虫。
Firefox的扩展名为mozRepl。
Emacs可以使用moz-reload-on-save模式插入此文件。
设置好后,保存文件将强制刷新浏览器窗口。
您可以在页面上放置一个javascript间隔,让它查询一个本地脚本,该脚本检查css文件的最后修改日期,并在更改后刷新它。
jQuery示例:
var modTime = 0;
setInterval(function(){
$.post("isModified.php", {"file":"main.css", "time":modTime}, function(rst) {
if (rst.time != modTime) {
modTime = rst.time;
// reload style tag
$("head link[rel='stylesheet']:eq(0)").remove();
$("head").prepend($(document.createElement("link")).attr({
"rel":"stylesheet",
"href":"http://sstatic.net/mso/all.css?v=4372"
})
);
}
});
}, 5000);
Browsersync可以从服务器端/浏览器外部执行此操作。
这样可以实现更多可重复的结果/不需要太多单击的事情。
这将提供一个页面并在更改时刷新
cd static_content
browser-sync start --server --files .
它还允许脚本模式。
您可以将live.js与tampermonkey脚本一起使用,以避免必须将其包含https://livejs.com/live.js
在HTML文件中。
// ==UserScript==
// @name Auto reload
// @author weirane
// @version 0.1
// @match http://127.0.0.1/*
// @grant none
// ==/UserScript==
(function() {
'use strict';
if (Number(window.location.port) === 8000) {
const script = document.createElement('script');
script.src = 'https://livejs.com/live.js';
document.body.appendChild(script);
}
})();
使用此tampermonkey脚本,live.js脚本将自动插入地址匹配的页面http://127.0.0.1:8000/*
。您可以根据需要更改端口。