Как заставить браузер Chrome перезагружать файл .css при отладке в Visual Studio?

В настоящее время я редактирую файл .css внутри Visual Studio 2012 (в режиме отладки). Я использую Chrome в качестве браузера. Когда я вносю изменения в файл .css моего приложения в Visual Studio и сохраняю, обновление страницы не загружается с обновленными изменениями в моем файле .css. Я думаю, что файл .css все еще кешируется.

Я пытался:

1. CTRL / F5
2. В Visual Studio 2012 перейдите в свойства проекта, вкладка «Веб». Выберите «Запустить внешнюю программу» в разделе «Действие запуска». Вставьте или выберите путь к Google Chrome (у меня есть C: \ Users \ xxx \ AppData \ Local \ Google \ Chrome \ Application \ chrome.exe) В поле Аргументы командной строки введите -incognito.
3. Воспользовавшись инструментами разработчика Chrome, нажмите на иконку «gear», отметьте «Disable Cache».

Кажется, ничего не работает, если я не прекращаю отладку вручную (закрываю Chrome), перезапускаю приложение (в отладке).

Есть ли способ заставить Chrome всегда перезагружать все изменения CSS и перезагружать файл .css?

Обновление:
1. Изменения стиля в моем файле .aspx обнаруживаются при обновлении. Но изменений в .css файле нет. 2. Это приложение ASP.NET MVC4, поэтому я нажимаю на гиперссылку, которая выполняет GET. При этом я не вижу нового запроса на таблицу стилей. Но, нажав F5, файл .css перезагружается, и код состояния (на вкладке сети) равен 200.

Есть гораздо более сложные решения, но очень простое и простое - просто добавить случайную строку запроса в ваш CSS-код.

Такие как src="/css/styles.css?v={random number/string}"

Если вы используете php или другой серверный язык, вы можете сделать это автоматически с time(). Так было быstyles.css?v=<?=time();?>

Таким образом, строка запроса будет новой каждый раз. Как я уже сказал, есть гораздо более сложные решения, которые более динамичны, но в целях тестирования этот метод является лучшим (IMO).

Чтобы заставить chrome перезаписать CSS и JS:

Вариант Windows 1: CTRL+ SHIFT+ R
Вариант Windows 2: SHIFT+F5

OS X: ⌘+ SHIFT+R

Обновлено как заявлено @PaulSlocum в комментариях (и многие подтвердили)

Оригинальный ответ:

Хром изменил поведение. Ctrl+ Rсделаю это.

На OS X: ⌘+R

Если у вас возникли проблемы с перезагрузкой файлов css / js, откройте инспектор ( CTRL+ SHIFT+ C) перед выполнением перезагрузки.

[ПРОЧИТАЙТЕ ОБНОВЛЕНИЕ НИЖЕ]

Самый простой способ, который я нашел, это настройки Chrome DevTools. Нажмите на значок шестеренки (или 3 вертикальные точки в более поздних версиях) в правом верхнем углу DevTools, чтобы открыть диалоговое окно «Настройки». Там поставьте галочку: «Отключить кеш (пока открыт DevTools)»

ОБНОВЛЕНИЕ: Теперь этот параметр был перемещен. Его можно найти на вкладке «Сеть», это флажок «Отключить кэш».

Вы имеете дело с проблемой кеша браузера.

Отключите кеш на самой странице. Это не сохранит файл поддержки страницы в браузере / кэше.

<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», которые перечислены в источнике группа, чтобы эта проблема с кешем исчезла.

Нажмите SHIFT+ F5.

Это работает для меня с Chrome версии 54.

я столкнулся с той же проблемой здесь! но я уверен, что мое разрешение лучше всех приведенных выше примеров, просто сделайте это,

1. Откройте консоль разработчика Chrome, нажав клавишу F12.
2. Щелкните правой кнопкой мыши по кнопке перезагрузки в верхней части браузера и выберите «Очистить кэш и полная перезагрузка».

Вот и все!

С macOS я могу заставить Chrome перезагрузить файл CSS, выполнив

⌘+ SHIFT+R

Нашел этот ответ, похороненный в комментариях здесь, но он заслуживал большего внимания.

Текущая версия Chrome (55.x) не перезагружает все ресурсы при перезагрузке страницы (Command + R) - и это бесполезно для отладки файла .css.

Command + R отлично работает, если вы хотите отлаживать только файлы .html, .php, .etc, и работает быстрее, потому что работает с локальными / кэшированными ресурсами (.css, .js). Вручную удалять кеш браузера для каждой итерации отладки не удобно.

Процедура принудительной перезагрузки .css файла на Mac (сочетание клавиш / Chrome): Ctrl + Shift + R

Я использую Edge Version 81.0.416.64 (Официальная сборка) (64-разрядная версия) и основана на проекте с открытым исходным кодом Chromium.

Нажмите, F12чтобы войти в Dev Tools.
Нажмите вкладку «Сеть» и «
Проверка».

Я знаю, что это старый вопрос, но если кто-то все еще ищет, как перезагрузить только один внешний файл css / js, самый простой способ теперь в Chrome:

1. Перейти на вкладку Сеть в DevTools
2. Щелкните правой кнопкой мыши по ресурсу и выберите Replay XHR, чтобы повторить запрос.

Убедитесь, что для принудительной перезагрузки выбран параметр « Отключить кэш» .

Для macOS Chrome:

1. Инструменты для разработчиков cmd+ alt+i
2. Нажмите три точки в правом верхнем углу в инструментах разработчика
3. Нажмите настройки
4. Прокрутите вниз до Network
5. Включить Disable cache (while DevTools is open)см. Скриншот:

Зачем нужно обновлять всю страницу? Просто обновите только 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);

Я решил этот простой трюк.

<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>

Все еще проблема.

Использование таких параметров, как "..css ?thing = random-value" ничего не меняет в моей поддержке клиентов. Работает только смена имени.

Еще один способ переименования файлов. Я использую URL Rewrite в IIS. Иногда Исипи Геликона переписывают.

Добавить новое правило.

+ Name: lame-chrome-fix.
+ Pattern: styles/(\w+)_(\d+)
+ Rewrite URL: /{R:1}.css

Примечание: я резервирую использование нижнего регистра, чтобы отделить имя от случайного числа. Может быть что-нибудь еще.

Пример:

<link href="https://stackoverflow.com/styles/template_<% 
Response.Write( System.DateTime.UtcNow.ToString("ddmmyyhhmmss")); %>" 
type="text/css" />

(Нет папки стилей, это просто часть имени шаблона)

Выходной код как:

<link href="/styles/template_285316115328" 
rel="stylesheet" type="text/css">

Перенаправить как:

(R: 1 = шаблон)

/template.css

Только объяснение длинное.

Просто возникла проблема, когда один человек, работающий с Chrome (на Mac), внезапно перестал загружать файл CSS. CMD + R не работал вообще. Мне не нравятся вышеизложенные предложения, которые вызывают постоянную перезагрузку производственной системы.

Что работало, так это изменение имени файла CSS в файле HTML (и, конечно, переименование файла CSS). Это заставило Chrome получить последний файл CSS.

Если вы используете Sublime Text 3, при использовании системы сборки для открытия файла открывается самая последняя версия и предоставляется удобный способ загрузить его через [CTRL + B]. Чтобы настроить систему сборки, которая открывает файл в chrome:

1. Перейти к «Инструменты»

2. Наведите указатель мыши на «построить систему». В нижней части появившегося списка нажмите «Новая система сборки ...»

3. В новой сборке системы тип файла:

   {"cmd": [ "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe", "$file"]}

** при условии, что путь, указанный выше в первом наборе кавычек, является путем к месту расположения chrome на вашем компьютере, если он не просто находит местоположение chrome и заменяет путь в первом наборе кавычек на путь к Chrome на вашем компьютере.

Самый простой способ достижения вашей цели - это открыть новое окно инкогнито в вашем chrome или приватное окно в Firefox, которое по умолчанию не будет кэшироваться.

Вы можете использовать это в целях разработки, чтобы вам не приходилось вставлять какой-то случайный кеш-код в ваш проект.

Если вы используете IE, то да поможет вам Бог!

Ctrl + F5

Shift + F5

Обе работают

Самый простой способ в Safari 11.0 macOS SIERRA 10.12.6: перезагрузить страницу из Origin, вы можете использовать справку, чтобы узнать, где в меню она находится, или использовать сочетание клавиш (alt) + command + R.

Chrome/firefox/safari/IE перезагрузит всю страницу с помощью этих ярлыков

Ctrl+ R (ИЛИ) Ctrl+F5

Надеюсь, это поможет вам!

Если вы используете SiteGround в качестве хостинговой компании и ни одно из других решений не помогло, попробуйте следующее:

От cPanel перейдите в «ИНСТРУМЕНТЫ УЛУЧШЕНИЯ САЙТА» и нажмите «SuperCacher». На следующей странице нажмите кнопку «Очистить кэш».