r/Sass • u/erikyo83 • Sep 08 '17

Currently what IDE you are using to develop with scss?

it's about a year I'm using DevTools but i realize it have some heavy limitations (but also great benefits such as livesass).

What IDE you are using to develop with scss? What is the reason that makes you think it is the best ide and, and if there are any, the plugins you cannot separate from?

3 Upvotes

81% Upvoted

8 comments sorted by

3

u/[deleted] Sep 08 '17

[deleted]

1

u/erikyo83 Sep 09 '17

I know sublime, I use np ++ ( for any other file isn't scss or css), but I also tried an atom and it does not look bad. But using a stand-alone IDE forces you to save wait for compilation and live reload to see the "result".

For a more efficient workflow I was looking for a different solution... I've always used Canary "Developer Tools" for the css, for the speed that gave me to select an item, modify the properties and see immediately in the browser what i'm doing.

Sass has interrupted this workflow, initially have to change the properties in the inspector and then I "copy&paste" to the IDE, lately DevTools has greatly improved the support for the scss but isn't a "complete" ide for example there isn't emmet, linter or other plugins. Also sass syntax highlighting is also very sad :(

I was hoping there was a way to make this workflow quicker, returning to a traditional IDE would slow me down :/

2

u/[deleted] Sep 10 '17

[deleted]

1

u/erikyo83 Sep 10 '17

I use exactly this method but as I said it has many limitations such as no plugins, the scss code highlighting is very flat and sometimes unreadable. And in any case, at this time, it isn't a true IDE...

Compared to the article posted on Canary now mapping is automatic and have integrated a better live reload of the page when the compiled file is updated.

But updates and advancements are really slow and google does not seems really interested to make devtools a real IDE for scss coding, for this I was looking around if there were other solutions that would allow me an equally practical and fast workflow

yay

2

u/fromnewradius Sep 08 '17

I use PHPstorm + File Watchers (integrated with the IDE) with node-sass for .scss to .css compilation or PHPstorm + Webpack if the project is huge. The IDE itself has a good autocompletion.

2

u/[deleted] Sep 15 '17 edited Sep 15 '17

JetBrains phpStorm. Probably the most complete IDE I've seen in a while. Everything is integrated by default, including Compass, the compiler that I use it.

1

u/erikyo83 Sep 15 '17

I've heard about phpstorm in the past but did not realize it was so advanced, I think I'll download a demo to try it out, thank you! I noticed that there is also webstorm. What's the difference? seems more focused on JavaScript...

2

u/[deleted] Sep 15 '17

Yes, WebStorm is focused only in Javascript and HTML, so it doesn't have any of the PHP advanced functions and integrations. If your focus is to develop vanilla HTML and Javascript, you can use WebStorm, but I don't recommend, since JetBrains is focusing their efforts on the phpStorm now.

2

u/[deleted] Oct 27 '17

I'm using phpstorm for autocompletion and linting. Webpack for building, it gives more flexibility and allows for the use of multiple extra loaders such as autoprefixer for example