问题
Until recently, my Chrome browser was loading CSS source map files correctly. Now, it is not.
The setting is on:
And the CSS files have a source mapping tag at the bottom:
/*# sourceMappingURL=Home.cshtml.css.map */
But the Network tab and Fiddler2 show that Chrome is not even trying to load the source map file.
Is there something that I'm missing? Is the sourceMappingURL syntax correct? I've toggled the "Enable CSS source maps" setting on and off.
Chrome version: 44.0.2403.30 beta-m
Sourcemap files generated by Web Essentials in VS 2013.
回答1:
You can try the following steps:
1- delete the map file and regenerate it again.
2- Using the chrome inspector, go to Settings > General and then click on the button "Restore defaults and reload"
回答2:
When the CSS file has the sourcemapping embedded as base64, then it seems to work fine.
For example:
/*# sourceMappingURL=data:application/json;base64,eyJ2....5235== */
回答3:
OMG! The problem made me crazy! I found that the CSS file is not complete. Here is what I did to solve the problem:
- Make sure that CSS maps are enabled in Dev tools settings.
- Check the end of CSS file whether it contains a link to the source map.
- Press
Shift+Click on the refresh buttonto force resources update.
回答4:
Your code seems to be okay, the only reason why it is not reflecting the changes because you are loading the cached CSS file. To load the new CSS file, you need to hold shift and press the reload button to ask chrome to reload all the files instead of to loading it from the cash.
回答5:
Does each scss file need to be accesible from the outside to make this work? I have css maps configured but I have see that each .scss file that is being processed is not accesible from the browser
来源：https://stackoverflow.com/questions/30650172/chrome-not-loading-css-source-maps