web-dev-qa-db-ja.com

ファイルの変更時にFirefoxを自動更新するにはどうすればよいですか？

Firefoxの拡張機能、または1つ以上のローカルファイルを監視できるスクリプトまたはその他のメカニズムを知っている人はいますか。 Firefoxは、ファイルの（タイムスタンプの）変更を検出すると、自動更新するか、キャンバスを更新します。

CSSを編集するには、完全なHTMLを再レンダリングするのではなく、CSSだけを再ロードできれば理想的です。

事実上、外部ファイルを介してのみ動的HTML/CSS編集を行うFirebugと同様の動作が可能になります。

htmlcssfirefoxbrowser
63
Charles Roper

自動再読み込みは、ローカルファイルの変更を監視し、ブラウザを更新するFirefoxの拡張機能です。

https://addons.mozilla.org/en-US/firefox/addon/auto-reload/

40
Harry Love

私はお勧めしますlivejs

ただし、次のAdvantagesおよびDeadvantages

利点：
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 しかし、それは動作しません。ダウンロードしてローカルで動作する必要があります。

7
Aamir Shahzad

Xrefresh firebugを使用。

6
Alysko

FirefoxにはmozReplという拡張機能があります。

Emacsはmoz-reload-on-save-modeでこれにプラグインできます。

セットアップ時にファイルを保存すると、ブラウザウィンドウが強制的に更新されます。

4
bob

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);
4
Sampson

この機能を含むいくつかのIDEがあります（それらには、ペインがあります。または、保存時にページを自動更新する他の手段があります）。

これを自分で行いたい場合は、ページの meta refresh を低い値（1〜2秒）に設定するのが簡単です。

# Will refresh the page content every second
<meta http-equiv="refresh" content="1" />
3
Mike Buckbee

Browsersync は、サーバー側/ブラウザーの外部からこれを行うことができます。

これにより、より再現性の高い結果/それほど多くのクリックを必要としないものを実現できます。

これはページを提供し、変更時に更新されます

cd static_content
browser-sync start --server --files .

また、スクリプトモードを使用できます。

2
Att Righ

FileWatcher拡張機能をご覧ください： https://addons.mozilla.org/en-US/firefox/addon/filewatcher/

  • それはWebExtensionなので、最新のFirefoxで動作します
  • ネイティブOS呼び出し（ポーリングなし！）を使用して監視ファイルの変更を監視し、WebページをリロードできるようにWebExtensionに通知するネイティブアプリ（ローカルにインストール）があります。
  • リロードはrulesによって駆動されます：ルールにはページURL（正規表現サポート付き）とその包含/除外が含まれますlocalソースファイル
  • オープンソース： https://github.com/coolsoft-ita/filewatcher

免責事項：私は拡張機能の著者です;）

0
nicorac

一定の間隔の後にいくつかのajaxリクエストを使用することで解決できると思います。 CSSファイルに対してリクエストを実行し、「not modified」ヘッダーを取得できない場合は、cssを削除して再度読み込みます。動的ファイルの場合、リクエストを実行してレスポンスを保存し、そのファイルに対してリクエストを行うたびに、レスポンスを最新のものと比較します。

0
mck89