Как сделать автоматическое обновление Firefox при изменении файла?

Кто-нибудь знает расширение для Firefox или script или какой-либо другой механизм, который может отслеживать один или несколько локальных файлов. Firefox автоматически обновит или иным образом обновит свой холст, когда обнаружит изменение (метки времени) в файлах.

Для редактирования CSS было бы идеально, если бы просто перезагрузить CSS, а не полностью перерисовать HTML.

Эффективно это позволило бы аналогичное поведение Firebug с его динамическим редактированием HTML/CSS только через внешние файлы.

Ответы

Ответ 1

Live.js

С веб-сайта:

Как? Просто включите Live.js, и он будет отслеживать текущую страницу, включая локальный CSS и Javascript, отправив на сервер последовательные запросы HEAD. Изменения в 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>

Ответ 3

Я бы рекомендовал livejs

Но он имеет следующие Преимущества и Недостатки

Преимущества:
1. Простая настройка
2. Удобно работает в разных браузерах (Live.js работает в Firefox, Chrome, Safari, Opera и IE6 +)
3. Не добавляйте раздражающий интервал для обновления браузера специально, когда вы хотите отлаживать вместе с проектированием 4. Обновление только при сохранении изменений ctrl + S
5. Непосредственно сохраняет CSS и т.д. Из firebug. Я не использовал эту функцию, но читал на своем сайте http://livejs.com/, что они тоже поддерживают его!!!

Недостатки:
1. Он не будет работать с файловым протоколом file:///C:/Users/Admin/Desktop/livejs/live.html
2. Вам нужно, чтобы сервер запускал его, как http://localhost
3. Вы должны удалить его во время развертывания на стадии постановки/производства
4. Не служит CDN. Я пробовал обманывать и применял прямую ссылку http://livejs.com/live.js, но это не сработает должны загружаться и работать на локальном компьютере.

Ответ 5

Вы можете просто разместить javascript-интервал на своей странице, запросить локальный script, который проверяет последнюю дату, измененную в файле 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);

Ответ 6

В Firefox есть расширение, называемое mozRepl.

Emacs может подключаться к этому, с режимом moz-reload-on-save.

когда он настроен, сохранение файла заставляет обновить окно браузера.

Ответ 7

Есть несколько IDE, которые содержат эту способность (у них будет панель внутри них или какие-либо другие средства для автоматического обновления страницы при сохранении).

Если вы хотите сделать это самостоятельно, вам нужно быстро установить meta refresh на странице с низким значением - один или два секунд.

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

Ответ 8

Browsersync может сделать это со стороны сервера/за пределами браузера.

Это может привести к более повторяемым результатам/вещам, которые не требуют столь большого нажатия.

Это будет обслуживать страницу и обновляться при изменении

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

Он также позволяет использовать сценарий.

Ответ 9

Посмотрите на расширение FileWatcher: https://addons.mozilla.org/en-US/firefox/addon/filewatcher/

  • это WebExtension, поэтому он работает с последним Firefox
  • у него есть собственное приложение (устанавливаемое локально), которое отслеживает наблюдаемые файлы на предмет изменений с помощью вызовов родной ОС (без опроса!) и уведомляет WebExtension, чтобы позволить ему перезагрузить веб-страницу
  • перезагрузка определяется правилами: правило содержит URL страницы (с поддержкой регулярных выражений) и включенные/исключенные локальные исходные файлы
  • открытый источник: https://github.com/coolsoft-ita/filewatcher

ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ: я автор расширения;)

Ответ 10

Я думаю, что вы можете решить его, используя некоторые ajax-запросы после определенного интервала. Вы можете сделать запрос к файлам CSS, а затем, если вы не получите заголовок "не изменен", вы удалите свой css и загрузите его снова. Для динамических файлов вы делаете запрос и сохраняете ответ, а затем каждый раз, когда вы делаете запрос к этому файлу, вы сравниваете ответ с последним.