Last day - Sass, source maps and live editing!
Sep 23, 2014
When September 1st hit, I thought, "Where did August go?" and now summer is over. I realized I haven't posted in a whole month but you what? I still feel like my #summerofme project was a success. The point of it was to learn how to make stuff just for fun, not worry about perfection, try new things and to just keep at it.
And I have been doing a lot of these things for the past month. Just not posting about it. Oops! For my last post, I'm going to share one more thing. Using source maps to debug your Sass and making changes to your Sass files, DIRECTLY from Chrome!
I'm not going to write a long blog post about it because someone else already did! Read more about it here. But here it is in a nutshell. When you compile your Sass, get it to also create a source map file. Then, in Chrome, update the settings to enable CSS source maps. And then, magic happens:
You can now see which Sass file the CSS rules are in!
To take it one step further, in Chrome's dev tools, you can map it to your CSS/Sass folder. After you set that up, whatever you change and save from Chrome's Sources tab UPDATES IN YOUR LOCAL FILES. Let that marinate.
Here's the link to the tutorial again. Oh yeah, the tutorial also shows how to do it with Grunt.
Go. Try it. Have fun!
Thanks to everyone who has checked in with my posts these last few months :)
And, now I'm signing off.
← Home