2017-09-13 141 views
0

(我考慮把這個超級用戶,但它真的更多的是編程的問題)需要角度重新編譯後兩次刷新瀏覽器

我使用的是在重新編譯我的angularjs代碼背景咕嚕browsersync任務時,它檢測到更改。我的角度是使用ES2015編寫的,並使用Babel通過咕task任務進行編譯。每次,在轉儲完成後,我必須在Chrome中執行一個艱難的CTRL-F5才能看到更改生效。在我的Chrome開發者工具中,我選中了「網絡>禁用緩存」選項。爲什麼我需要刷新兩次,有沒有辦法只需要刷新一次而不需要手動清除緩存或不得不使用某種黑客?

+0

緩存行爲由Web服務器控制。這個問題不是特定於Angular或任何其他客戶端的事情。如果您希望服務器不會緩存腳本,則會錯誤地配置它。 – estus

回答

1

我真的不知道這會幫助,但我有我加入一些隨機字符串我的腳本的src後面解決類似的問題

//to tell the browser it's a different script 
<script src="myscript.js?id=123123121"></script> 

讓瀏覽器識別爲一個不同的腳本;我使用gulp,jspm,webpack和我實現上面的代碼的方式是通過使用一個插件,它會在每次編譯時用Date.now()重寫腳本

+0

謝謝約翰,我正在尋找一種更乾淨的方法來解決這個問題,而不是必須破解的東西。 –

+0

@ChrisHalcrow這是處理這種情況的有效方法,特別是在生產中。 'id'可以是文件時間戳或build#。這將在啓用瀏覽器緩存的同時刷新最終用戶和開發人員的腳本。 – estus

0

我發現問題是我是使用單獨的瀏覽器選項卡中的直接URL加載我的頁面,而不是使用其指定的端口號連接到grunt browsersync的選項卡(我需要這樣做是因爲我的一些頁面組件依賴於端口號,所以我需要來控制這一點)。在grunt transpile之後,我需要等到連接的url的瀏覽器重新加載完成後,才能在另一個選項卡中刷新我的頁面,然後第一次看到刷新的代碼。