Visual Studioでのデバッグ中にChromeブラウザーに.cssファイルを強制的に再読み込みさせる方法は？

現在Visual Studio 2012内（デバッグモード）で.cssファイルを編集しています。ブラウザとしてChromeを使用しています。Visual Studio内でアプリケーションの.cssファイルに変更を加えて保存すると、ページを更新しても.cssファイルの更新された変更が読み込まれません。.cssファイルはまだキャッシュされていると思います。

私が試してみました：

1. CTRL / F5
2. Visual Studio 2012で、[プロジェクトのプロパティ]の[Web]タブに移動します。[開始アクション]セクションで[外部プログラムの開始]を選択します。GoogleChromeのパスを貼り付けるか参照します（Mine is C：\ Users \ xxx \ AppData \ Local \ Google \ Chrome \ Application \ chrome.exe）コマンドライン引数ボックスに-incognito
3. Chromeデベロッパーツールを使用して、[歯車]アイコンをクリックし、[キャッシュを無効にする]をオンにしました。

手動でデバッグを停止（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が述べたように更新されました（多くは確認済みです）

元の答え：

Chromeの動作が変更されました。Ctrl+ Rやります。

OS Xの場合：⌘+R

css / jsファイルの再読み込みに問題がある場合は、再読み込みを実行する前にインスペクター（CTRL+ SHIFT+ C）を開きます。

[下の更新を読む]

私が見つけた最も簡単な方法は、Chrome DevToolsの設定です。DevToolsの右上にある歯車のアイコン（または最近のバージョンでは3つの縦のドット）をクリックして、[設定]ダイアログを開きます。そこで、「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. F12キーを押してChrome開発者コンソールを引き上げます
2. ブラウザの上部にある再読み込みボタンを右クリックし、[キャッシュを空にして再読み込み]を選択します。

それで終わりです！

macOSでは、次のようにしてChromeにCSSファイルをリロードさせることができます

⌘+ SHIFT+R

この回答はここのコメントに埋もれていましたが、より多くの露出に値しました。

現在のバージョンのChrome（55.x）では、ページをリロードするときにすべてのリソースがリロードされません（コマンド+ R）。これは、.cssファイルのデバッグには役立ちません。

Command + Rは、.html、.php、.etcファイルのみをデバッグする場合に正常に機能し、ローカル/キャッシュされたリソース（.css、.js）で機能するため、より高速です。デバッグの反復ごとにブラウザのキャッシュを手動で削除するのは便利ではありません。

Macで.cssファイルを強制的に再読み込みする手順（キーボードショートカット/ Chrome）：コマンド+ Shift + R

私はEdgeバージョン81.0.416.64（公式ビルド）（64ビット）を使用しており、Chromiumオープンソースプロジェクトに基づいています。

押しF12てDev Toolsに入ります。
[ネットワーク]タブをクリックし、[
キャッシュを無効にする]をオンにします。

私はそれが古い質問であることを知っていますが、誰かが単一の外部css / jsファイルだけをリロードする方法をまだ探しているなら、Chromeで今最も簡単な方法は次のとおりです。

1. [ネットワーク]タブに移動しますDevToolsのに
2. リソースを右クリックし、[ XHRを再生 ]を選択してリクエストを繰り返します。

リロードを強制するには、[ キャッシュを無効にする ]オプションが選択されていることを確認してください。

macOS Chromeの場合：

1. オープン開発者ツールcmd+ alt+i
2. 開発者ツールの右上隅にある3つのドットをクリックします
3. 設定をクリック
4. 下にスクロールして Network
5. 有効Disable cache (while DevTools is open)参照スクリーンショットを。

ページ全体を更新する必要があるのはなぜですか？ページをリロードせずに、CSSファイルのみを更新してください。たとえば、DBからの長い応答を待つ必要がある場合に非常に役立ちます。DBからデータを取得してページに入力したら、CSSファイルを編集してChrome（またはFirefox）に再ロードします。そのためには、CSS Reloader Extensionをインストールする必要があります。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？something = random-value」などのパラメーターを使用しても、カスタマーサポートのエクスペリエンスは変わりません。名前の変更のみが機能します。

ファイル名を変更するもう1つの方法。IISでURL書き換えを使用しています。ヘリコンのIsapi Rewrite。

新しいルールを追加します。

+ 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

説明だけが長いです。

（Macで）Chromeを実行している1人のユーザーがCSSファイルのロードを突然停止するというこの問題が発生しました。CMD + Rはまったく機能しませんでした。本番システムに永続的なリロードを強制する上記の提案は好きではありません。

うまくいったのは、HTMLファイル内のCSSファイルの名前を変更することです（もちろん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で新しいシークレットウィンドウを開くか、Firefoxでプライベートウィンドウを開くことです。Firefoxでは、デフォルトではキャッシュされません。

これを開発目的で使用できるので、プロジェクトにランダムキャッシュ防止コードを挿入する必要がありません。

あなたがIEを使用しているなら、神があなたを助けるかもしれません！

Ctrl + F5

Shift + F5

どちらも機能します

Safari 11.0 macOS SIERRA 10.12.6での最も簡単な方法：Originからページを再読み込みします。ヘルプを使用して、メニューのどこにあるかを確認したり、ショートカットオプション（alt）+コマンド+ Rを使用したりできます。

Chrome/firefox/safari/IE これらのショートカットでページ全体をリロードします

Ctrl+ R （または）Ctrl+F5

お役に立てば幸いです。

ホスティング会社としてSiteGroundを使用していて、他のソリューションがどれも機能していない場合は、これを試してください。

cPanelから[SITE IMPROVEMENT TOOLS]に移動し、[SuperCacher]をクリックします。次のページで、[キャッシュのフラッシュ]ボタンをクリックします。