CODEWITHSUNDEEP
csssass
sdorr
sdorr

Reputation: 35

Can you generate .scss files from .css.map

I was given some files from another developer and was told to make some changes. Within the file structure, there's a .css file and a .css.map file.

I'm relatively new to SASS, but my understanding is that you create a .scss file and use command line: sass --watch style.scss:style.css, which generates the .css.map file and compiles the sass into css.

Is there a way to work backwards with just the .css file and the .css.map file to generate the .scss files, or did the other dev just maybe forget to give me these files?

Upvotes: 1

Views: 7325

Answers (2)

yanike
yanike

Reputation: 847

Yes you can. Using Chrome, inspect something on the page, go to "Sources" tab, go to "Page" tab, expand down to the SCSS files generated from the CSS Map (basically the original SCSS files).

Example below is using WordPress and I was in your situation where all I had was the CSS Map file. Just copy and/or save the files one by one into the appropriate folder. Now you have the SCSS files :)

enter image description here

Upvotes: 4

Karl
Karl

Reputation: 850

The CSS is the output of Sass and you cannot generate the original Sass files from the CSS.

As stated by thesassway, source maps (.css.map) seek to bridge the gap between higher-level languages like CoffeeScript and Sass and the lower-level languages they compile down to (JavaScript and CSS). Source maps allow you to see the original source (the CoffeeScript or Sass) instead of the compiled JavaScript or CSS while debugging.

(TL;DR, they are for debugging)

If you were to edit the CSS output files without using SASS to compile them, the next person who writes in the Sass files and compiles them will overwrite your work.

I'm not sure why the other dev will want you to make changes directly to the CSS output files, but asking them for guidance on what that are expecting you to do won't hurt anyone. :)

Upvotes: 2

Related Questions