CODEWITHSUNDEEP
sublimetext2google-chrome-devtools
user3481992
user3481992

Reputation: 33

trying to make code in Chrome developer tools more presentable

I need to investigate the css and js files of some websites. When I open them in Chrome developer tools they sometimes look fine and are properly formatted but sometimes a file can run along a single line like this:

enter image description here

And when I paste it into my text editor, Sublime, it looks like this:

enter image description here

Is there a way in developer tools or Sublime that I can format the file properly, so it is clearly legible? I'm curious as to why a big file can run across a single line like that. Is it to protect it in some way, done with their CMS, to make it hard for people like to look into it, because there are other times when css and js files are formatted just perfectly.

Upvotes: 1

Views: 456

Answers (1)

spacemigas
spacemigas

Reputation: 791

This is called minification and serves two purposes:

  1. Make the code smaller so it downloads faster
  2. Obfuscate code so it's harder to read

In dev tools you can use pretty print:

Chrome pretty print

Upvotes: 2

Related Questions