Как заставить работать LiveReload + Sublime Text 3 в Chrome?

Question

[massef]

Проверял в Firefox, работает, в Chrome не хочет.

Answer 1

[issid]

1.устанавливаете плагин LiveReload в chrome
2. устанавливаете LiveReload в Sublime Text 3
3. в Sublime Text 3 заходите в Preferences > Package Settings > LiveReload > Setting - User
4. пишете

{
"enabled_plugins": [
"SimpleReloadPlugin",
"SimpleRefresh"
]
}

5. нажимаете на значок плагина в chrome он подключается к Sublime Text 3.
6. пользуетесь!

Comments

[Velynder]

В Chrome работает, но перед закрывающим тэгом боди пропишите

<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>

и разрешите выполнение скрипта на странице, если ругается.

Answer 2

[fainer]

Как установить Livereloat (автоматический релоад html страницы проекта)

1. Устанавливаем программу Livereload для windows с livereload.com

2. Устанавливаем плагин в Chrome https://goo.gl/6Te9My

3. Удаляем плагин Livereload из Sublime если он есть (блокирует нужные порты).

4. Открываем программу windows livereload, выбираем папку с проектом, клацаем мышкой по появившемуся названию папки в прямоугольнике и вставляем полученный код в файл html который будет обновляться. Все. После сохранения файла скрипта результаты тут же появятся. Если все равно не работает, то нажать f5.

У плагина в Chrome есть одна особенность. которую я не понял. Если кликнуть по иконке livereload находясь на обычном сайте, то окружность по середине иконки станет наполненной и всплывающее окно при наведении покажет disable LiveReaload (отключить LiveReload). А если кликнуть эту же иконку находясь на странице проекта (на компьютере), то не происходит ничего, хотя сам LiveReload для этой конкретной страницы будет работать.

Comments

[koposov_v]

Чел, ты лучший я пытался сделать через галп, но так ничего и не вышло.

У хрома все норм, просто нужно в расширениях у livereload поставить галочку "Разрешить открывать файлы по ссылкам".
В хроме на любую иконку расширения ПКМ -> Управление расширениями, ищите Livereload в списке и ставите эту галочку.

И все будет четко

Answer 3

[Ejvel]

В Sublime Text 3 заходите в Preferences > Package Settings > LiveReload > Setting - User

{
"enabled_plugins": [
"SimpleReloadPlugin",
"SimpleRefresh"
]
}

P.S. Setting - User, не Setting - Default

Answer 4

[Marya Chuvatkina]

Помимо расширения для chrome и плагина нужна программа LiveReload для компьютера (отсюда livereload.com ). Ее я использовала лишь для получения кода, который нужно вставить в html-файл перед закрывающим body.
Чтобы получить код:
1. закрыть Sublime Text 3
2. в программе LiveReload в меню слева нажать "add" и добавить папку с сайтом
3. под "add" появится элемент, нажать на него
4. появится поле с кодом, который надо скопировать
Далее обязательно закрыть программу LiveReload (только так будет работать), вставить код в html-файл, нажать на значок расширения в chrome - все работает.

Answer 5

[toldotoller]

Запарил меня этот livereload!!!
Вот мое решение, вчера написал:

1.Скрипт JS (livereload.js):

var lastnumber = '';
setInterval("docReload()", 100);

function docReload(){
$.ajax({
type:'post',
url: 'livereload.php',
success:function (data) {
if(lastnumber != ''){
if(data != lastnumber){
location.reload();
}
}
else{
lastnumber = data;
}
}
});
}

2. Скрипт php (livereload.php):

$homepage = file_get_contents('index.html');
echo $homepage;

Comments

[Illia T]

True coger)

Answer 6

[Валерий]

Устанавливали плагин для chrome https://chrome.google.com/webstore/detail/liverelo... ?

Comments

[massef]

ну конечно

Answer 7

[stikname]

Вы нашли решение проблемы? Если да, то расскажите пожалуйста.

Comments

[massef]

Нет, гуглил на зарубежных ресурсах, решения нет. Я пошел другим путем, разобрался в Gulp и верстаю поднимаю локальный сервер. Можно еще прикрутить BrowserSync и тогда браузер будет обновляться не только на десктопе но еще и на моб.устройствах, очень удобно. Плюс много других плюшек. Можно еще Prepos попробовать.

Answer 8

[NekijKtoto]

в сам Sublime Text3 устанавливать плагин LiveReload не надо, иначе не будет работать и будет выскакивать сообщение об ошибке (liveReload tried to listen on port 35729, but it was occupied by another app. - LiveReload пытался слушать порт 35729, но он был занят другим приложением.). Для работы в хроме нужно установить программу LiveReload на комп и его приложение в хроме. В приложениях поставить галку - Разрешить открывать файлы по ссылкам и указать путь до папки в программе для компа. Всё.

Answer 9

[Сергей Корниенко]

Мучения с LiveReload Взято на

19.07.2017 KorSer

После нескольких часов изучения понятия LiveReload, попыток подружить его с SublimeText3 и штудирования разных методик устранения проблем выработал следующий алгоритм (Работает на Хроме и Опере):

Ставим плагин LiveReload в SublimeText:
— Ctrl+Shift+P
— Вводим в окошке «Install Package»
— Вводим LiveReload. Устанавливаем плагин.
— Заходим в настройки Default и User плагина: Preferences — Package Settings — LiveReload — Settings Defaiult и Settings User.
— Пишем там
{«enabled_plugins»: [«SimpleReloadPlugin», «SimpleRefresh» ]}
Скачиваем программу LiveReload download.livereload.com/windows/LiveReloadSetup.exe
Устанавливаем на компьютер. Запускаем.
Жмем кнопку +add.
Находим на жестком диске папку сайта с которым работаете в SublimeText. Выделяете её и жмете «Выбор папки».
Жмете на появившемся названии папки и во втором окошке копируете текст похожий на этот

Закрываем программу LiveReload и запускаем SublimeText.
Вставляем скопированный текст в тег в самом верху.
Запускаем либо перезагружаем страницу в браузере.
Делимся мнением

Comments

[Сергей]

наконец заработало, после того как скачал exe программу для компа. Яваскрипт из программы не обязательно вставлять в html, у меня и без него заработало. Этот скрипт еще вставляется через консоль, если нажать ctrl+shift+p и ввести livereload.js.