How to auto-reload css in Chrome after editing SASS files

别等时光非礼了梦想. 提交于 2019-11-30 03:18:45

问题


I am trying to set up the mapping feature in Chrome canary. I followed the screenshots in this answer.

The main feature works, when I inspect an element, it points me to my local sass file and when I edit it, the local file safes, and the `sass --watch' is triggered. However, the browser does not refresh, even though on the "General" tab in devtools I have checked "Auto-reload CSS upon Sass save".

Should the browser reload? Is there a way to get it to reload?

Ps - I have compass but I can not use that as it does not support mapping, so I am compiling sass through the terminal

Thanks


回答1:


It could be that the Sass-file is still compiling when Chrome tries to reload the CSS. Setting the 'Auto-reload CSS upon Sass save' Timeout to 5000 ms fixed it for me. When Chrome triggers the reload, it can even prevent Sass from recompiling the CSS.




回答2:


You probably forgot this step:

In the Sources tab, find your generated CSS file, right click on it and choose Map to network resource, and select the same file name in the shown dropdown:

and then choose the matching file from your workspace:




回答3:


I solved the problem by installing tincr extention and now when I save locally, the browser refreshes.



来源:https://stackoverflow.com/questions/17004119/how-to-auto-reload-css-in-chrome-after-editing-sass-files

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!