1. ホーム
  2. css

[解決済み] Visual Studioでデバッグ中にChromeブラウザに.cssファイルを強制的に再読み込みさせる方法は?

2022-04-29 11:14:34

質問

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

試してみました。

  1. CTRL / F5
  2. Visual Studio 2012の場合。 プロジェクトのプロパティのWebタブを開きます。 アクションの開始]セクションで[外部プログラムの開始]を選択します。 Google Chromeのパスを貼り付けるかブラウズしてください(私のはC:³³です)。 コマンドライン引数ボックスに -incognito と入力します。
  3. Chromeのデベロッパーツールを使用し、歯車のアイコンをクリックし、キャッシュを無効にするをチェックします。

手動でデバッグを停止し(Chromeを終了)、アプリケーションを再起動(デバッグ中)しないと、何も動かないようです。

Chromeが常にすべてのCSSの変更を再読み込みし、.cssファイルを再読み込みするように強制する方法はありますか?

更新しました。

1. .aspxファイル内のインラインスタイルの変更は、更新したときにピックアップされます。しかし、.cssファイルでの変更はそうではありません。 2. ASP.NET MVC4アプリなので、ハイパーリンクをクリックすると、GETされます。その際、スタイルシートに対する新しいリクエストは表示されません。しかし、F5をクリックすると、.cssファイルが再ロードされ、(ネットワークタブの)ステータスコードは200になります。

どうすればいいですか?

もっと複雑な解決策もありますが、とても簡単でシンプルな方法は、CSSのincludeにランダムなクエリ文字列を追加することです。

例えば src="/css/styles.css?v={random number/string}"

phpや他のサーバーサイドの言語を使っている場合は、これを自動的に time() . つまり、次のようになります。 styles.css?v=<?=time();?>

この方法では、クエリ文字列は毎回新しいものになります。もっとダイナミックで複雑なソリューションもありますが、テスト目的ではこの方法が一番です(IMO)。