Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial


3 Answers


They're called "source maps", and are primarily used by Firefox and Chrome debuggers. They exist so that the debugger can display compiled CSS (via LESS, SASS, etc.) in a readable format. In other words, if you're using a CSS preprocessor, and the browser debugger attempts to display the resulting CSS, it's gobbledeygook. A source map acts as an intermediary to explain what the compiled CSS maps to in the source file.

Here's a more detailed description: http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/

Hope that helps, -james

Darren Healy
Darren Healy
Front End Web Development Techdegree Student 23,565 Points

Thanks James, that info at the link is a bit too heavy for me right now!

Last questions.

  1. I should leave these files in?
  2. Should I link to them in the HTML?

If you're not using a CSS preprocessor like Sass or LESS, you can just delete them. You can always download them again later if need be.

If you're curious as to how to actually use them, Dale Sande has a video on them here. The video also doesn't just apply to Sass, but also to LESS and even jQuery, too.


If you're not using a CSS preprocessor, you can safely delete them.

Me too!