Google Chrome "Failed to parse SourceMap": css.map (Web Essential)

Question

Visual Studio 2013 UP5 + Web Essential (version 2.6.36) generated css.map files are not valid in Google Chrome, however it is valid in Firefox. Because of this, it has become impossible to debug fewer files in google chrome.

I am currently using Web Essential 2.6.36 (+ Visual Studio 2013 Up5). I can disable the source map from the Google Chrome Developer Settings. Which will remove these errors, however we cannot debug fewer files and change the style. This is a terrible problem.

Any advice would be appreciated. Thank you in advance.

Answer 1

The problem is that WebEssentials saves files in UTF8 with BOM , but Chrome cannot open these files as .map files.

As a temporary fix, you can go to your .map file in Visual Studio and save it as Unicode (UTF-8 without a signature) or US-ASCII using

 File -> Advanced Save Options -> Unicode (UTF-8 without signature) or US-ASCII. 

It is possible that when you change the associated .css file, you will have to repeat this process. However, when I tested adding some rules to .css , the correct format was saved for the .map file.

I reported this on WebEssentials GitHub: Issue 1993

And there are a few more reports:

• Problem 1994
• Issue 1977