Visual Studio में डीबगिंग करते समय .css फ़ाइल को पुनः लोड करने के लिए क्रोम ब्राउज़र को कैसे मजबूर करें?


151

मैं वर्तमान में Visual Studio 2012 (डीबग मोड में) के अंदर एक .css फ़ाइल संपादित कर रहा हूँ। मैं अपने ब्राउज़र के रूप में क्रोम का उपयोग कर रहा हूं। जब मैं अपने एप्लिकेशन की .css फ़ाइल में Visual Studio के अंदर परिवर्तन करता हूँ और सहेजता हूँ, तो पृष्ठ को ताज़ा करने से मेरे .css फ़ाइल में हुए परिवर्तन को लोड नहीं किया जाएगा। मुझे लगता है कि .css फ़ाइल अभी भी कैश की गई है।

मैंने कोशिश की है:

  1. CTRL / F5
  2. विजुअल स्टूडियो 2012 में, प्रोजेक्ट प्रॉपर्टीज पर जाएं, वेब टैब स्टार्ट एक्शन सेक्शन में स्टार्ट एक्सटर्नल प्रोग्राम चुनें या गूगल क्रोम के लिए पथ पर ब्राउज़ करें (मेरा है C: \ Users \ xxx \ AppData \ Local \ Google \ Chrome \ Application \ chrome.exe) कमांड लाइन आर्ग्युमेंट्स बॉक्स में -incognito
  3. Chrome डेवलपर टूल का उपयोग किया, "गियर" आइकन पर क्लिक करें, चेक किया गया "कैश अक्षम करें।"

जब तक मैं मैन्युअल रूप से डिबगिंग करना बंद नहीं करता, (क्रोम से बाहर), तब तक एप्लिकेशन (डिबग में) को पुनरारंभ करने पर कुछ भी नहीं लगता है।

क्या Chrome को हमेशा सभी सीएसएस परिवर्तनों को पुनः लोड करने और .css फ़ाइल को फिर से लोड करने के लिए बाध्य करने का कोई तरीका है?

अपडेट:
1. मेरे .aspx फ़ाइल में इन-लाइन स्टाइल में परिवर्तन होता है जब मैं ताज़ा करता हूं। लेकिन .css फ़ाइल में परिवर्तन नहीं होता है। 2. यह एक ASP.NET MVC4 ऐप है इसलिए मैं एक हाइपरलिंक पर क्लिक करता हूं, जो एक GET करता है। ऐसा करते हुए, मुझे स्टाइलशीट के लिए एक नया अनुरोध नहीं दिख रहा है। लेकिन F5 पर क्लिक करके .css फ़ाइल पुनः लोड की जाती है और स्थिति कोड (नेटवर्क टैब पर) 200 है।


4
f12 -> नेटवर्क -> राइट-क्लिक -> स्पष्ट ब्राउज़र कैश (मुझे यह पसंद नहीं है, इसलिए मैं
फ़ायरबग के

मैंने भी बस यही कोशिश की। यह काम करने के लिए प्रतीत नहीं होता है।
duyn9uyen

क्या आपने सभी मेनियल राइट-क्लिक और क्लिक के बाद इसे रीफ्रेश करने की कोशिश की?
thkang

हाँ। मैंने अपनी .aspx फ़ाइल में भी परिवर्तन किया है। यह परिवर्तन और इन-लाइन css परिवर्तन उठाता है, केवल .css फ़ाइल में परिवर्तन नहीं करता है।
duyn9uyen

एक ही नेटवर्क टैब पर, आप अपनी .cssफ़ाइल की प्रविष्टि देख सकते हैं - मुझे नहीं पता कि मैं इतना आश्वस्त नहीं हूं, लेकिन मेरे अजगर फ्लास्क देव सर्वर कैश्ड प्रविष्टियों की स्थिति कोड में 304 है जबकि पुन: डाउनलोड की गई फ़ाइलों में 200 हैं यह देखने के लिए कि क्या सर्वर-साइड की समस्या है, अपने स्टेटस कोड और अनुरोध समय की जाँच करें।
3

जवाबों:


148

बहुत अधिक जटिल समाधान हैं, लेकिन एक बहुत ही आसान, सरल है बस अपने सीएसएस में एक यादृच्छिक क्वेरी स्ट्रिंग जोड़ना है।

जैसे कि src="/css/styles.css?v={random number/string}"

यदि आप php या किसी अन्य सर्वर-साइड भाषा का उपयोग कर रहे हैं, तो आप इसके साथ स्वचालित रूप से कर सकते हैं time()। तो यह होगाstyles.css?v=<?=time();?>

इस तरह, क्वेरी स्ट्रिंग हर बार नई होगी। जैसा कि मैंने कहा, बहुत अधिक जटिल समाधान हैं जो अधिक गतिशील हैं, लेकिन परीक्षण उद्देश्यों में यह विधि शीर्ष (आईएमओ) है।


17
बस उत्पादन पर इसका उपयोग न करें या आप अपने सीएसएस की कैशिंग क्षमताओं को खो देंगे। कौन - सी एक अच्छी बात है।
बार्ट कैलिक्सो

3
क्या होगा यदि आप एकल पृष्ठ एप्लिकेशन का उपयोग कर रहे हैं और आपको सीएसएस को फिर से लोड करने के लिए एप्लिकेशन को बताने की आवश्यकता है क्योंकि संस्करण बदल गया है?
नाथन सी। टार्च

10
@ NathanC.Tresch आप संस्करण बदलते हैं जब संस्करण यादृच्छिक / समय स्ट्रिंग करने के बजाय बदलता है जो हर बार बदलता है। सबसे अच्छा तरीका यह होगा कि आप स्वयं css फाइल के चेकसम का उपयोग करें।
बार्ट कैलिक्सो

क्या आप शुरुआती लोगों के लिए इस जवाब को स्पष्ट कर सकते हैं? आप वास्तव में "बस एक यादृच्छिक क्वेरी स्ट्रिंग कैसे जोड़ेंगे"? शुरुआती लोग अपने काम में भी परिवर्तन देखने में सक्षम होना चाहते हैं, और हम में से अधिकांश को इस बात का कोई पता नहीं है कि इसका कोई मतलब क्या है या उत्तर की खोज कैसे करें।
रैंडी

@ कैंडी मैंने एक उदाहरण दिया जिसमें php का उपयोग किया गया था जिसमें आप वर्तमान टाइमस्टैम्प को क्वेरी पैरामीटर के रूप में प्रस्तुत करते हैं। बैकएंड पर आपकी जो भी भाषा है, उसका उपयोग करके आप कुछ ऐसा ही कर सकते हैं। यदि आप अपने निपटान में है, तो आप इसे ग्रंट / गल्प बिल्ड चरण के माध्यम से भी कर सकते हैं।
Anson

207

सीएसएस और जेएस को फिर से लोड करने के लिए क्रोम को मजबूर करने के लिए:

विंडोज विकल्प 1: CTRL+ SHIFT+ R
विंडोज विकल्प 2: SHIFT+F5

OS X: + SHIFT+R

टिप्पणियों में @PaulSlocum द्वारा कहा गया अद्यतन (और कई की पुष्टि की)


मूल उत्तर:

क्रोम ने व्यवहार बदल दिया। Ctrl+ Rक करोगे।

OS X पर: +R

यदि आपको सीएसएस / जेएस फ़ाइलों को पुनः लोड करने में समस्याएं हैं, तो पुनः लोड करने से पहले निरीक्षक ( CTRL+ SHIFT+ C) खोलें ।


26
और यहाँ मैं पागलों की तरह CTRL + F5 दबा रहा था ... धन्यवाद।
एलिक्स एक्सल

3
प्रयास करने के लिए एक और टिप: कोड-pal.com/quick-tip-clear-cache-hard-refresh-on-chrome
duyn9uyen

3
@ duyn9uyen अच्छी बात! लगता है कि वे फिर से व्यवहार बदल रहे हैं। यह क्रोम विंडोज वर्जन में जोड़ा गया है, अभी तक मैक पर उपलब्ध नहीं है।
बार्ट कैलिक्सो

4
Ctrl + R फ़ायरफ़ॉक्स में भी काम कर रहा है। मुझे रैंडम यूआरएल और अन्य चीजों से राहत देने के लिए धन्यवाद।
जीशानफ

30
CTRL + R मेरे लिए काम नहीं करता है, लेकिन CTRL + SHIFT + R इसे करता है
पॉल स्लोकुम

139

[पढ़ें नीचे पढ़ें]

सबसे आसान तरीका जो मैंने पाया है वह Chrome DevTools सेटिंग्स में है। "सेटिंग्स" संवाद को खोलने के लिए DevTools के शीर्ष-दाईं ओर गियर आइकन (या अधिक हाल के संस्करणों में 3 ऊर्ध्वाधर डॉट्स) पर क्लिक करें। वहां, बॉक्स पर टिक करें: "कैश अक्षम करें (जबकि DevTools खुला है)"


अद्यतन: अब इस सेटिंग को स्थानांतरित कर दिया गया है। यह "नेटवर्क" टैब में पाया जा सकता है, यह "चेक कैश" लेबल वाला एक चेकबॉक्स है। यहाँ छवि विवरण दर्ज करें


15
यह सबसे अच्छा समाधान IMHO है: आपको अपने सीएसएस यूआरएल के लिए यादृच्छिक मूल्य प्रदान करने के लिए अपने स्वयं के कोड के साथ गड़बड़ करने की आवश्यकता नहीं है।
गिलाउम

2
उत्कृष्ट उत्तर! ... एक आकर्षण की तरह काम किया!
१।

1
मैंने यह भी पाया कि यह सबसे अच्छा समाधान है।
जो हुआंग

3
इसे क्रोम के अधिक हाल के संस्करणों में ले जाया गया है: नेटवर्क टैब पर जाएं और हेडर में "कैश अक्षम करें" जांचें।
जेसन क्लेमेंस

Ctrl + Shift + R और Shift + F5 तरीके मेरे लिए काम नहीं करते हैं - अनुमान है कि हाल ही में क्रोम में कुछ बदला गया है। यह तरीका अभी भी बहुत अच्छा है। @JasonClemens: "कैश अक्षम करें" विकल्प नेटवर्क टैब और सेटिंग्स दोनों में है।
आमोस एम। बढ़ई

11

आप ब्राउज़र कैश की समस्या से निपट रहे हैं।

पेज में ही कैशे को डिसेबल करें। यह ब्राउज़र / कैश में पेज की सहायक फ़ाइल को सेव नहीं करेगा।

<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

यह ब्राउज़र को कैश फाइल करने की अनुमति नहीं देगा, अंततः फाइल को अस्थायी अस्थायी ब्राउज़र में संग्रहीत नहीं किया जाएगा, इसलिए कोई कैश नहीं है, इसलिए किसी भी लोडिंग की आवश्यकता नहीं होगी :)

मुझे यकीन है कि यह करेगा :)


1
यह स्वीकृत उत्तर होना चाहिए। @anson समाधान मेरे लिए काम नहीं किया।
पियरिक मार्टेलीयर

8

मेरे मामले में, Chrome DevTools सेटिंग्स में, बस "अक्षम करें कैश (जबकि DevTools खुला है)" काम नहीं करता है, इसे "CSS स्रोत मैप सक्षम करें" और "Auto-reload generate CSS" की जाँच करने की आवश्यकता है, जो स्रोत में सूचीबद्ध हैं समूह, इस कैश समस्या को दूर करने के लिए।


6

SHIFT+ दबाएं F5

यह मेरे लिए क्रोम संस्करण 54 के साथ काम कर रहा है।


धन्यवाद। इस थ्रेड पर ctrl-r लोकप्रिय उत्तर होने के बावजूद, केवल शिफ्ट-एफ 5 ने मेरे लिए काम किया (क्रोमियम 55)।
user2662680

5

मैं यहाँ एक ही समस्या का सामना करना पड़ा था! लेकिन मुझे यकीन है, मेरा संकल्प उपरोक्त सभी उदाहरणों से बेहतर है, बस यही करें,

  1. Chrome डेवलपर कंसोल को F12 दबाकर खींच लें
  2. ब्राउज़र के शीर्ष पर पुनः लोड बटन पर राइट क्लिक करें और "खाली कैश और हार्ड रीलोड" चुनें।

यह `है!


4

MacOS के साथ, मैं Chrome फ़ाइल को करने के लिए Chrome को पुनः लोड करने के लिए बाध्य कर सकता हूं

+ SHIFT+R

इस उत्तर को यहां टिप्पणियों में दफन पाया गया, लेकिन यह अधिक जोखिम के लायक था।


3

Chrome का मौजूदा संस्करण (55.x) जब आप पृष्ठ (कमांड + आर) को पुनः लोड करते हैं, तो सभी संसाधन पुनः लोड नहीं करते हैं - और यह .css फ़ाइल को डीबग करने के लिए उपयोगी नहीं है।

यदि आप केवल .html, .php, .etc फ़ाइलों को डीबग करना चाहते हैं, तो कमांड + आर ठीक काम करता है और स्थानीय / कैश्ड संसाधनों (.css, .js) के साथ काम करने के कारण तेज़ है। प्रत्येक डीबग चलना के लिए ब्राउज़र का कैश मैन्युअल रूप से हटाना सुविधाजनक नहीं है।

मैक (कीबोर्ड शॉर्टकट / क्रोम) पर पुनः लोड .css फ़ाइल को बाध्य करने की प्रक्रिया: कमांड + शिफ्ट + आर


3

मैं एज संस्करण 81.0.416.64 (आधिकारिक निर्माण) (64-बिट) का उपयोग कर रहा हूं और यह क्रोमियम ओपन सोर्स प्रोजेक्ट पर आधारित है।

F12Dev Tools में जाने के लिए दबाएँ ।
नेटवर्क टैब
चेक कैश अक्षम करें पर क्लिक करें

यहाँ छवि विवरण दर्ज करें


2

मुझे पता है कि यह एक पुराना सवाल है, लेकिन अगर कोई अभी भी देख रहा है कि कैसे सिर्फ एक बाहरी सीएसएस / js फ़ाइल को फिर से लोड करना है, तो क्रोम में अब सबसे आसान तरीका है:

  1. DevTools में नेटवर्क टैब पर जाएं
  2. संसाधन पर राइट क्लिक करें और अनुरोध को दोहराने के लिए रिप्ले एक्सएचआर चुनें

सुनिश्चित करें कि कैश को अक्षम करने का विकल्प पुनः लोड करने के लिए चुना गया है।


2

MacOS Chrome के लिए:

  1. ओपन डेवलपर्स उपकरण cmd+ alt+i
  2. डेवलपर्स टूल्स में टॉप राइट कॉर्नर पर तीन डॉट्स पर क्लिक करें
  3. सेटिंग्स पर क्लिक करें
  4. नीचे स्क्रॉल करें Network
  5. Disable cache (while DevTools is open)स्क्रीनशॉट देखें सक्षम करें : यहाँ छवि विवरण दर्ज करें

1

पूरे पृष्ठ को ताज़ा करने की आवश्यकता क्यों है? पृष्ठ को पुनः लोड किए बिना केवल सीएसएस फ़ाइलों को ताज़ा करें। यह बहुत उपयोगी है जब, उदाहरण के लिए, आपको डीबी से लंबी प्रतिक्रिया का इंतजार करना होगा। एक बार जब आप डीबी से डेटा प्राप्त करते हैं और पृष्ठ को पॉप्युलेट करते हैं, तो अपनी सीएसएस फ़ाइलों को संपादित करें और उन्हें क्रोम (या फ़ायरफ़ॉक्स) में पुनः लोड करें। ऐसा करने के लिए आपको CSS Reloader एक्सटेंशन इंस्टॉल करना होगा । फ़ायरफ़ॉक्स संस्करण भी उपलब्ध है।


1

आप इस स्क्रिप्ट को क्रोम कंसोल में कॉपी कर सकते हैं और यह आपकी सीएसएस स्क्रिप्ट को हर 3 सेकंड में पुनः लोड करने के लिए मजबूर करता है। कभी-कभी सीएसएस शैलियों में सुधार करते समय मुझे यह उपयोगी लगता है।

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

1

मैं इस सरल चाल से हल किया।

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

1

फिर भी एक मुद्दा है।

"..कैंस? कुछ = यादृच्छिक-मूल्य" जैसे मापदंडों का उपयोग करने से मेरे ग्राहक-समर्थन अनुभव में कुछ भी नहीं बदलता है। केवल नाम परिवर्तन से काम चलता है।

एक और फ़ाइल नाम बदलने पर ले लो। मैं IIS में URL पुनर्लेखन का उपयोग करता हूं। कभी-कभी हेलिकॉन के इसापी रीराइट।

नया नियम जोड़ें।

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

पुनर्निर्देशित करें:

(आर: 1 = टेम्पलेट)

/template.css

केवल व्याख्या लंबी है।


0

बस यह समस्या थी जहां क्रोम (मैक पर) चलने वाले एक व्यक्ति ने अचानक सीएसएस फ़ाइल लोड करना बंद कर दिया था। CMD + R ने बिल्कुल काम नहीं किया। मुझे ऊपर दिए गए सुझाव पसंद नहीं हैं जो उत्पादन प्रणाली पर एक स्थायी पुनः लोड करने के लिए मजबूर करते हैं।

क्या काम किया HTML फ़ाइल में सीएसएस फ़ाइल का नाम बदल रहा था (और सीएसएस फ़ाइल का नाम बदलकर)। इसने Chrome को नवीनतम CSS फ़ाइल प्राप्त करने के लिए मजबूर किया।


0

यदि आप उदात्त पाठ 3 का उपयोग कर रहे हैं, तो फ़ाइल को खोलने के लिए एक बिल्ड सिस्टम का उपयोग करने से सबसे वर्तमान संस्करण खुलता है और इसे लोड करने के लिए एक सुविधाजनक तरीका प्रदान करता है [CTRL + B] क्रोम में फ़ाइल खोलने वाले बिल्ड सिस्टम को सेट करने के लिए:

  1. 'टूल' पर जाएं

  2. अपने माउस को your बिल्ड सिस्टम ’पर घुमाएँ। लाई गई सूची में सबसे नीचे 'न्यू बिल्ड सिस्टम ...' पर क्लिक करें।

  3. नई बिल्ड सिस्टम फ़ाइल में यह टाइप करें:

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

** उद्धरणों के पहले सेट में ऊपर वर्णित पथ प्रदान किया गया है, जहाँ आपके कंप्यूटर पर क्रोम स्थित है, अगर यह केवल क्रोम का स्थान नहीं खोजता है और पथ के साथ उद्धरण के पहले सेट में पथ को बदल देता है आपके कंप्यूटर पर क्रोम


0

अपने लक्ष्य को प्राप्त करने का सबसे सरल तरीका है कि आप फ़ायरफ़ॉक्स में अपने क्रोम या निजी विंडो में एक नई गुप्त विंडो खोलें जो कि डिफ़ॉल्ट रूप से होगी, कैश नहीं।

आप इसका उपयोग विकास उद्देश्यों के लिए कर सकते हैं ताकि आपको अपनी परियोजना में कोड को रोकने वाले कुछ यादृच्छिक कैश को इंजेक्ट न करना पड़े।

यदि आप IE का उपयोग कर रहे हैं तो भगवान आपकी मदद कर सकता है!



0

सफारी पर सबसे आसान तरीका 11.0 macOS सिएरा 10.12.6: ओरिजनल पेज ओरिजिन से, आप यह पता लगाने के लिए मदद का उपयोग कर सकते हैं कि यह मेनू में कहाँ स्थित है, या आप शॉर्टकट विकल्प (alt) + कमांड + आर का उपयोग कर सकते हैं।


-1

Chrome/firefox/safari/IE इन शॉर्टकट्स द्वारा पूरे पृष्ठ को पुनः लोड करेगा

Ctrl+ R (या) Ctrl+F5

आशा है कि यह आपकी मदद कर सकता है !.


-1

यदि आप अपनी होस्टिंग कंपनी के रूप में साइटगेड का उपयोग कर रहे हैं और किसी भी अन्य समाधान ने काम नहीं किया है, तो यह कोशिश करें:

CPanel से, "SITE IMPROVEMENT TOOLS" पर जाएं और "SuperCacher" पर क्लिक करें। अगले पृष्ठ पर, "फ्लश कैश" बटन पर क्लिक करें।


इस उत्तर का विजुअल स्टूडियो और न ही क्रोम ब्राउज़र से कोई लेना-देना है। साथ ही, यह प्रश्न 4 साल पहले पूछा गया था, और पहले से ही एक स्वीकृत समाधान था। कृपया उन्हें जवाब देने के लिए शीर्ष पर 'बम्पिंग' सवालों से बचने की कोशिश करें, जब तक कि सवाल पहले से हल के रूप में चिह्नित नहीं किया गया था, या आपने समस्या का एक नया और बेहतर समाधान पाया। अपने जवाबों की गिनती करने के लिए कुछ युक्तियों के महान उत्तर लिखने के दस्तावेज़ीकरण की जाँच करें :)
ओब्सीडियन आयु

हाय ओब्सीडियन। मैं क्षमाप्रार्थी हूं। मैंने पहली बार यहां पोस्ट किया है। मैंने इस समस्या के समाधान के लिए लंबी और कड़ी खोज की। स्वीकृत जवाब मेरे काम नहीं आया। जब मुझे कोई समाधान मिला (अपने स्वयं के शोध के माध्यम से), मैं किसी और की मदद करके "इसे आगे भुगतान करना चाहता था" जो इस समस्या का सामना करता है, अगर यह चार साल पुराना है। मुझे यकीन नहीं है कि मेरी कार्रवाई यहां कलाई पर थप्पड़ का वार करेगी, क्योंकि यह मुझे वैध लगता है। फिर भी, मैं भविष्य में सावधान रहना सुनिश्चित करूंगा (वास्तव में-मेरा मतलब यह नहीं है कि एक झपकीदार तरीके से)। साभार- डॉन
डॉन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.