Como forçar o navegador Chrome a recarregar o arquivo .css durante a depuração no Visual Studio?

No momento, estou editando um arquivo .css dentro do Visual Studio 2012 (no modo de depuração). Estou usando o Chrome como meu navegador. Quando eu faço alterações no arquivo .css do meu aplicativo dentro do Visual Studio e salvo, a atualização da página não será carregada com a alteração atualizada no meu arquivo .css. Eu acho que o arquivo .css ainda está em cache.

Eu tentei:

1. CTRL / F5
2. No Visual Studio 2012, acesse Propriedades do projeto, guia Web. Escolha Iniciar Programa Externo na seção Iniciar Ação. Cole ou navegue até o caminho do Google Chrome (o meu é C: \ Usuários \ xxx \ AppData \ Local \ Google \ Chrome \ Application \ chrome.exe) Na caixa de argumentos da linha de comando, coloque -incognito
3. Utilizou as ferramentas de desenvolvedor do Chrome, clique no ícone "engrenagem" e marque "Desativar cache".

Nada parece funcionar, a menos que eu pare manualmente a depuração (feche o Chrome), reinicie o aplicativo (na depuração).

Existe alguma maneira de forçar o Chrome a sempre recarregar todas as alterações de css e recarregar o arquivo .css?

Atualização:
1. As alterações de estilo em linha no meu arquivo .aspx são detectadas quando eu atualizo. Mas as alterações em um arquivo .css não. 2. É um aplicativo ASP.NET MVC4, então clico em um hiperlink, que faz um GET. Fazendo isso, não vejo uma nova solicitação para a folha de estilo. Mas, clicando em F5, o arquivo .css é recarregado e o código de status (na guia rede) é 200.

Existem soluções muito mais complicadas, mas uma solução muito fácil e simples é apenas adicionar uma string de consulta aleatória ao seu CSS.

Tal como src="/css/styles.css?v={random number/string}"

Se você estiver usando php ou outro idioma do servidor, poderá fazer isso automaticamente com time(). Então seriastyles.css?v=<?=time();?>

Dessa forma, a string de consulta será nova todas as vezes. Como eu disse, existem soluções muito mais complicadas e dinâmicas, mas, para fins de teste, esse método é o melhor (IMO).

Para forçar o chrome a carregar os css e js:

Opção 1 do Windows: CTRL+ SHIFT+ R
Opção 2 do Windows: SHIFT+F5

OS X: ⌘+ SHIFT+R

Atualizado conforme declarado por @PaulSlocum nos comentários (e muitos confirmados)

Resposta original:

O Chrome mudou o comportamento. Ctrl+ Rfará isso.

No OS X: ⌘+R

Se você tiver problemas para recarregar arquivos css / js, abra o inspetor ( CTRL+ SHIFT+ C) antes de fazer o recarregamento.

[LEIA A ATUALIZAÇÃO ABAIXO]

A maneira mais fácil que encontrei é nas configurações do Chrome DevTools. Clique no ícone de roda dentada (ou 3 pontos verticais, nas versões mais recentes) no canto superior direito do DevTools para abrir a caixa de diálogo "Configurações". Marque a caixa: "Desativar cache (enquanto o DevTools estiver aberto)"

ATUALIZAÇÃO: Agora, essa configuração foi movida. Pode ser encontrado na guia "Rede", é uma caixa de seleção chamada "Desativar cache".

Você está lidando com o problema do cache do navegador.

Desative o cache na própria página. Isso não salvará o arquivo de suporte da página no navegador / cache.

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

Esse código você precisa / precisa inserir na headtag da página que está depurando ou na headtag de master page do seu site

Isso não permitirá que o navegador armazene em cache o arquivo; eventualmente, os arquivos não serão armazenados em arquivos temporários do navegador; portanto, não será necessário cache, portanto não será necessário recarregar :)

Tenho certeza que isso vai fazer :)

No meu caso, nas configurações do Chrome DevTools, basta definir "Desativar cache (enquanto o DevTools está aberto)" não funcionar, é necessário marcar "Ativar mapas de origem CSS" e "Recarregar automaticamente o CSS gerado", listados na fonte grupo, para resolver esse problema de cache.

Pressione SHIFT+ F5.

Está funcionando para mim com a versão 54 do Chrome.

eu tinha enfrentado o mesmo problema aqui! mas com certeza, minha resolução é melhor que todos os exemplos acima, basta fazer isso,

1. Abra o console do desenvolvedor do Chrome pressionando F12
2. Clique com o botão direito do mouse no botão recarregar na parte superior do navegador e selecione "Esvaziar cache e recarregar com força".

É isso aí!

Com o macOS, posso forçar o Chrome a recarregar o arquivo CSS fazendo

⌘+ SHIFT+R

Encontrei esta resposta enterrada nos comentários aqui, mas merecia mais exposição.

A versão atual do Chrome (55.x) não recarrega todos os recursos quando você recarrega a página (Command + R) - e isso não é útil para depurar o arquivo .css.

Command + R funciona bem se você deseja depurar apenas os arquivos .html, .php, .etc e é mais rápido porque funciona com recursos locais / em cache (.css, .js). Excluir manualmente o cache do navegador para cada iteração de depuração não é conveniente.

Procedimento para forçar a recarga do arquivo .css no Mac (atalho de teclado / Chrome): Command + Shift + R

Estou usando o Edge Versão 81.0.416.64 (versão oficial) (64 bits) e é baseado no projeto de código aberto do Chromium.

Pressione F12para entrar no Dev Tools.
Clique na guia Rede e clique em
Desativar cache.

Eu sei que é uma pergunta antiga, mas se alguém ainda estiver procurando atualizar apenas um único arquivo css / js externo, a maneira mais fácil agora no Chrome é:

1. Vá para a guia Rede no DevTools
2. Clique com o botão direito do mouse no recurso e selecione Replay XHR para repetir a solicitação

Verifique se a opção Desativar cache está selecionada para forçar o recarregamento.

Para o macOS Chrome:

1. Desenvolvedores de software livre ferramentas cmd+ alt+i
2. Clique em três pontos no canto superior direito nas ferramentas do desenvolvedor
3. Clique em configurações
4. Role para baixo até Network
5. Ativar Disable cache (while DevTools is open)veja a captura de tela:

Por que é necessário atualizar a página inteira? Apenas atualize apenas os arquivos css sem recarregar a página. É muito útil quando, por exemplo, você precisa esperar uma resposta longa do DB. Depois de obter dados do DB e preencher a página, edite seus arquivos css e recarregue-os no Chrome (ou no Firefox). Para fazer isso, você precisa instalar a extensão CSS Reloader . A versão do Firefox também está disponível.

Você pode copiar e colar esse script no console do Chrome e isso força seus scripts CSS a recarregar a cada 3 segundos. Às vezes, acho útil quando estou melhorando os estilos 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);

Eu resolvi com esse truque simples.

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

Ainda é um problema.

Usar parâmetros como "..css? Something = value-random" não muda nada na minha experiência de suporte ao cliente. Somente as alterações de nome funcionam.

Outra visão sobre a renomeação de arquivos. Eu uso a reescrita de URL no IIS. Às vezes, o Isapi Rewrite da Helicon.

Adicione nova regra.

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

Nota: Reservo o uso de undercase para separar o nome do número aleatório. Poderia ser qualquer outra coisa.

Exemplo:

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

(Nenhuma pasta de estilos é apenas uma parte do nome do padrão)

Código de saída como:

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

Redirecionar como:

(R: 1 = modelo)

/template.css

Apenas a explicação é longa.

Só tive esse problema em que uma pessoa executando o Chrome (em um Mac) parou de repente de carregar o arquivo CSS. CMD + R NÃO funcionou. Não gosto das sugestões acima que forçam uma recarga permanente no sistema de produção.

O que funcionou foi alterar o nome do arquivo CSS no arquivo HTML (e renomear o arquivo CSS, é claro). Isso forçou o Chrome a obter o arquivo CSS mais recente.

Se você estiver usando o Sublime Text 3, o uso de um sistema de compilação para abrir o arquivo abre a versão mais atual e fornece uma maneira conveniente de carregá-lo via [CTRL + B] Para configurar um sistema de compilação que abra o arquivo no chrome:

1. Vá para 'Ferramentas'

2. Passe o mouse sobre o 'sistema de compilação'. No final da lista exibida, clique em 'Novo sistema de compilação ...'

3. No novo arquivo de sistema de construção, digite isto:

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

** desde que o caminho indicado acima no primeiro conjunto de cotações seja o caminho para o local onde o chrome está localizado no seu computador, se não for simplesmente encontrar o local do chrome e substitua o caminho no primeiro conjunto de cotações pelo caminho para chrome no seu computador.

A maneira mais simples de atingir seu objetivo é abrir uma nova janela anônima no Chrome ou no Chrome. uma janela privada no Firefox, que por padrão não será armazenada em cache.

Você pode usar isso para fins de desenvolvimento, para não precisar injetar algum cache aleatório, impedindo o código no seu projeto.

Se você estiver usando o IE, que Deus o ajude!

Ctrl + F5

Shift + F5

Ambos trabalham

Maneira mais fácil no Safari 11.0 macOS SIERRA 10.12.6: Recarregar página da origem, você pode usar a ajuda para descobrir onde está localizado no menu, ou a opção de atalho (alt) + command + R.

Chrome/firefox/safari/IE recarregará a página inteira com esses atalhos

Ctrl+ R (OU) Ctrl+F5

Espero que ajude você!

Se você estiver usando o SiteGround como sua empresa de hospedagem e nenhuma das outras soluções funcionou, tente o seguinte:

No cPanel, vá para "FERRAMENTAS DE MELHORIA DO SITE" e clique em "SuperCacher". Na página seguinte, clique no botão "Flush Cache".