Как заставить браузер Chrome перезагрузиться.css-файл во время отладки в Visual Studio?
в настоящее время я редактирую.css-файл внутри Visual Studio 2012 (в режиме отладки). Я использую Chrome в качестве браузера. Когда я внесу изменения в свое заявление .css-файл внутри Visual Studio и сохранить, обновление страницы не будет загружаться с обновленным изменением в моем .файл CSS. Я так думаю .CSS-файл кэшируется.
Я пробовал:
- сочетания клавиш ctrl / f5 в
- В Visual Studio 2012 В, Зайти в свойства проекта, вкладка веб Выберите Запустить внешнюю программу в раздел начать действие Вставьте или перейдите к пути для Google Chrome (мой C:UsersxxxAppDataLocalGoogleChromeApplicationchrome - ... исполняемый) В поле аргументы командной строки поместите-incognito
- использовал инструменты разработчика Chrome, нажмите на значок "шестеренка", отметьте "отключить кэш"."
ничего не работает, если я вручную не остановлю отладку (закройте Chrome), перезапустите приложение (в debug).
есть ли способ заставить Chrome всегда перезагрузите все изменения css и перезагрузите .файл css?
обновление:
1. In-line стиль меняется в моем .aspx-файл берется при обновлении. Но изменения в .CSS-файл не.
2. Это ASP.NET MVC4 приложение, поэтому я нажимаю на гиперссылку, которая делает GET. Делая это, я не вижу нового запроса на таблицу стилей. Но нажав F5, то .файл css перезагружается, а код состояния (на вкладке "Сеть") равен 200.
22 ответов
есть гораздо более сложные решения, но очень простой, простой-это просто добавить случайную строку запроса в CSS include.
например src="/css/styles.css?v={random number/string}"
Если вы используете PHP или другой серверный язык, вы можете сделать это автоматически с time()
. Так и будет styles.css?v=<?=time();?>
таким образом, строка запроса будет новой каждый раз. Как я уже сказал, есть гораздо более сложные решения, которые более динамичны, но в целях тестирования это method is top (ИМО).
чтобы принудить chrome к reaload css и js:
Windows Вариант 1:CTRL + SHIFT + R
Windows Вариант 2:SHIFT + Ф5
OS X:⌘ + SHIFT + R
Обновлено, как указано @PaulSlocum в комментариях (и многие подтвердили)
оригинальный ответ:
Chrome изменить поведение. Ctrl + R сделает это.
на OS X:⌘ + R
Если у вас возникли проблемы с перезагрузкой файлов css/ js, откройте инспектор (CTRL + SHIFT + C) перед делаю перезарядку.
[ПРОЧИТАЙТЕ ОБНОВЛЕНИЕ НИЖЕ]
самый простой способ, который я нашел, - это настройки Chrome DevTools. Нажмите на значок шестеренки (или 3 вертикальные точки, в более поздних версиях) в правом верхнем углу DevTools, чтобы открыть диалоговое окно "настройки". Там поставьте галочку: "Отключить кэш (пока DevTools открыт)"
UPDATE: теперь этот параметр был перемещен. Его можно найти на вкладке "Сеть", это флажок с надписью"отключить кэш".
Вы имеете дело с проблемой кэш браузера.
отключите кэш на самой странице. Это не сохранит поддерживающий файл страницы в браузере / кэше.
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="expires" content="Tue, 01 Jan 1990 12:00:00 GMT" />
этот код требуется/нужно вставить в head
тег страницы, которую вы отлаживаете, или в head
тег master page
вашего сайта
это не позволит браузеру кэшировать файл, в конечном итоге файлы не будут храниться во временных файлах браузера, поэтому кэш не будет, поэтому перезагрузка не будет требуется:)
Я уверен, что это будет делать :)
в моем случае в настройках Chrome DevTools просто установите " отключить кэш (в то время как DevTools открыт)" не работает, ему нужно проверить "включить исходные карты CSS" и "автоматически перезагрузить сгенерированный CSS",которые перечислены в исходной группе, чтобы устранить эту проблему с кэшем.
Я столкнулся с той же проблемой здесь! но я уверен, что мое решение лучше, чем все вышеперечисленные примеры, просто сделайте это,
- потяните консоль разработчика Chrome, нажав F12
- щелкните правой кнопкой мыши на кнопке перезагрузки в верхней части браузера и выберите "пустой кэш и жесткая перезагрузка."
с macOS я могу заставить Chrome перезагрузить файл CSS, выполнив
⌘ + SHIFT + R
нашел этот ответ похоронен в комментариях здесь но он заслуживал большего воздействия.
текущая версия Chrome (55.x) не перезагружает все ресурсы при перезагрузке страницы (Command + R) - и это не полезно для отладки .файл CSS.
Command + R отлично работает, если вы хотите отлаживать только .формат HTML. ,РНР. ,etc файлы, и быстрее, потому что работает с локальными / кэшированными ресурсами (.стиль CSS. ,в JS). Вручную удалять кэш браузера для каждой итерации отладки не удобно.
процедура принудительной перезагрузки .css-файл на Mac (сочетание клавиш / Chrome): Команда + Shift + R
Я знаю, что это старый вопрос, но если кто-то все еще ищет, как перезагрузить только один внешний файл css/js, самый простой способ теперь в Chrome:
- на сеть в DevTools
- Правой Кнопкой Мыши на ресурсе и выберите воспроизвести XHR повторить запрос
убедитесь, что отключить кэш для принудительной перезагрузки выбран параметр.
зачем нужно обновлять всю страницу? Просто обновите только css-файлы без перезагрузки страницы. Это очень полезно, когда, например, вам приходится долго ждать ответа от БД. После получения данных из БД и заполнения страницы отредактируйте css-файлы и перезагрузите их в Chrome (или Firefox). Для этого необходимо установить расширение CSS Reloader. Также доступна версия Firefox.
вы можете скопировать вставить этот скрипт в консоль Chrome, и он заставляет ваши CSS-скрипты перезагружаться каждые 3 секунды. Иногда я нахожу это полезным, когда я улучшаю стили CSS.
var nodes = document.querySelectorAll('link');
[].forEach.call(nodes, function (node) {
node.href += '?___ref=0';
});
var i = 0;
setInterval(function () {
i++;
[].forEach.call(nodes, function (node) {
node.href = node.href.replace(/\?\_\_\_ref=[0-9]+/, '?___ref=' + i);
});
console.log('refreshed: ' + i);
},3000);
еще вопрос.
использование таких параметров, как "..css?something=random-value " ничего не меняет в моем опыте поддержки клиентов. Работает только изменение имени.
еще один взять на переименование файла. Я использую перезапись URL в IIS. Иногда переписывают Isapi Геликона.
добавить новое правило.
+ Name: lame-chrome-fix.
+ Pattern: styles/(\w+)_(\d+)
+ Rewrite URL: /{R:1}.css
Примечание: я резервирую использование undercase для отделения имени от случайного числа. Может быть что-то еще.
пример:
<link href="/styles/template_<%
Response.Write( System.DateTime.UtcNow.ToString("ddmmyyhhmmss")); %>"
type="text/css" />
(без папки стилей это просто часть имени шаблона)
выходной код:
<link href="/styles/template_285316115328"
rel="stylesheet" type="text/css">
редирект как:
(R:1 = шаблон)
/шаблон.в CSS
только объяснение длинное.
просто была эта проблема, когда один человек под управлением Chrome (на Mac) внезапно прекратил загрузку файла CSS. CMD + R не работал вообще. Мне не нравятся предложения выше, которые заставляют постоянную перезагрузку производственной системы.
Что сработало, это изменение имени файла CSS в файле HTML (и переименование файла CSS, конечно). Это заставило Chrome получить последний файл CSS.
Если вы используете Sublime Text 3, Использование системы сборки для открытия файла открывает самую последнюю версию и предоставляет удобный способ ее загрузки с помощью [CTRL + B] Чтобы настроить систему сборки, которая открывает файл в chrome:
перейти к 'Tools'
наведите курсор мыши на 'build system'. В нижней части приведенного списка нажмите "новая система сборки"...'
-
в новом типе файла системы сборки это:
{"cmd": [ "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe", "$file"]}
* * при условии, что путь, указанный выше в первом наборе кавычек путь, где chrome находится на вашем компьютере, если это не просто найти местоположение chrome и заменить путь в первом наборе кавычек с путем к chrome на вашем компьютере.
Я решил этот простой трюк.
<script type="text/javascript">
var style = 'assets/css/style.css?'+Math.random();;
</script>
<script type="text/javascript">
document.write('<link href="'+style+'" rel="stylesheet">');
</script>
самый простой способ достичь своей цели -открыть новое окно в режиме инкогнито в вашем chrome или приватное окно в firefox который будет по умолчанию, а не кэш.
вы можете использовать это для целей развития, так что вам не придется вводить какой-то случайный кэш предупреждения кода в проекте.
Если вы используете IE, то пусть Бог поможет вам!
Если вы используете SiteGround в качестве хостинговой компании, и ни одно из других решений не сработало, попробуйте следующее:
из cPanel перейдите в раздел " инструменты улучшения сайта "и нажмите "Суперкэшер"."На следующей странице нажмите кнопку" Очистить кэш".
самый простой способ на Safari 11.0 macOS SIERRA 10.12.6: Перезагрузите страницу из Origin, вы можете использовать справку, чтобы узнать, где в меню она находится, или вы можете использовать опцию ярлыка(alt) + command + R.
Chrome/firefox/safari/IE
перезагрузит всю страницу этими ярлыками
Ctrl + R (или) Ctrl + Ф5
надеюсь, что это может помочь вам!.