But I agree with your points. Despite its flaws, it is probably the best thing out there for creating visual layouts from code.
But I agree with your points. Despite its flaws, it is probably the best thing out there for creating visual layouts from code.
Best IDE ever. Better than emacs. And I've loved emacs for a couple years, and Vim for 10 years before that. Webstorm even comes with a Vim plugin.
IntelliJ is really rocking it. Webstorm for webdev, Cursive for clojure (https://cursive-ide.com/), PyCharm for python (https://www.jetbrains.com/pycharm/)... every one of those IDEs feels amazing out of the box.
It sounds dumb, but just try it. You'll get hooked on Webstorm and never want to go back. Example: press shift twice. It pops up a "Search Everywhere" box, and you can type filenames, symbol names, actions (Rename, etc)... it's basically helm M-x, but way better.
You won't ever feel like "CSS names are bad!" because you won't ever need to remember anything. Want to center something? Just type "align" and usually webstorm pops up autocomplete with the right thing. And that's true in every context: https://i.imgur.com/jCAAesF.png
All of these IDEs are specializations of IntelliJ IDEA (https://www.jetbrains.com/idea/download/#section=mac). They specialize it for web and call it WebStorm, for Python and call it PyCharm, etc. But all the plugins and settings work in all the IDEs, so really the underlying awesomeness is IDEA.
At this point I trust IDEA enough to know that if I open any codebase, I can start navigating it right away. Doesn't matter if it's C++, ocaml, or VueJS. Typing shift-shift will always let me jump to definitions.
Yeah it costs money, but $13/mo is super reasonble. Dropbox was similarly impactful on my life, and that was $10/mo.
>Just type "align" and usually webstorm pops up autocomplete with the right thing
VS Code does both of these things, and is FOSS
It's not so much that it has X feature or Y widget, but rather that the whole ecosystem feels cohesive. With emacs you sort of cobble together your configurations until you're happy with it, and that's very powerful -- it's why it's so successful. But there's something to be said for having "awesomeness out of the box". It's why Spacemacs was so popular.
I hear you about FOSS. I was reeeeally hesitant to throw my time into yet another closed source clusterfuck. I grew up as a gamedev, and back in 2000 that meant you had to use Visual Studio. All of my VS skills are now completely obsolete. And whenever I ran into VS issues, I couldn't debug it since it was closed source.
Two things convinced me IDEA is probably worthwhile:
1. They're partially open source. https://github.com/JetBrains/intellij-community You can build that from source and run it, so you can at least see how most of the system is architected. You won't be able to extend some of the closed-source plugins, but you get some of the benefits of FOSS.
2. Their tooling is their primary business model. When Microsoft lost their VS monopoly, Microsoft didn't die. JetBrains' sole focus is making the tooling ecosystem work; they're the Adobe of tooling.
FWIW Cursive is a bit sluggish to start, but after it's done indexing it feels like the best Lisp development environment ever made.
[1]: https://plugins.jetbrains.com/plugin/4986-ocaml-support
Amusingly someone made a plugin for pg's Arc 3.1 code back in '08: https://i.imgur.com/Xe7mvIB.png
If IDEA doesn't support a particular language, it's pretty easy to fork an existing plugin and throw together some lexer rules.
But I can not praise its abilities as you do. My experience has been mixed. Sure it's cool when it works well, but then its bugs are all the more painful. You expect intelligence and you get the opposite.
Take this bug I reported two years ago: https://youtrack.jetbrains.com/issue/WEB-19183
It thinks "y" is a global if I put "x.y = ..." anywhere in my code. Genius!
Also, It's lacking in its support for Vue Js. I get lots of red squiggles all over my code for perfectly valid Vue props, and PostCSS within single-page Vue component also is weak (no $variables support).
git clone https://github.com/vuejs/vue-hackernews-2.0 && cd vue-hack* && yarn && webstorm .
shift-shift "Item" should show https://i.imgur.com/AV1bbXG.png
And `this.$store.` should show the proper completions:
It's possible that I've been getting along without the features that some other editor provides. Does VSCode have better Vue integration?
Here is Webstorm complaining about in a legit Vue v-for statement in a .vue single-page component.
And second image is what it does when I try to use PostCSS variables.
Vue's tooling is context aware. It knows when you're within a <style scoped> tag. I see that there's a PostCSS plugin: https://i.imgur.com/JTPlIEk.png
Theoretically, the tooling should be able to use that plugin's lexer rules. PostCSS already registers itself as a language (pcss) so Vue's tooling logic should be: "are we within a <style scoped> tag? search for PostCSS tooling; if if none found, use vanilla CSS."
It already does this for <style lang="scss">, so postcss should definitely work. The logic happens in https://github.com/JetBrains/intellij-plugins/tree/master/vu... if you want to explore it.
But it's flawed. PostCSS is itself a host for plugins. So a WebStorm PostCSS plugin would need to allow user to select the PostCSS plugins that they are using.
Case in point: I use postcss-simple-vars but the WebStorm plugin assumes I use postcss-custom-properties. And so it fails me.
Yeah for a repro you just just need to do this: https://imgur.com/a/N2S2r
And you can see the warning when you hover over choices in the second image.
I'll try repro'ing it.
I think we should open a ticket in the appropriate place though. There's a good chance that a plugin maintainer can look into this and fix it quickly. It's such a clear example of brokenness, and should be pretty easy to fix.
I'm not quite sure where to raise the issue though. And I'm falling asleep, so that's all for now.
https://youtrack.jetbrains.com/issues/WEB?q=vue
So I figure it'll get fixed some day... probably after I move to another framework.
Meanwhile, after launch, the IDE grabs focus about six times while loading. Symbol navigation sometimes picks up random unrelated functions from ignored folders instead of the one sitting right beside the file, because it has the same name. Want autocomplete for that vertical-align's value? It just throws up every possible value for any CSS property.
Pretty bad when code editors running in a browser engine are getting more usable than your paid product.
Symbol navigation sometimes picks up random unrelated functions from ignored folders instead of the one sitting right beside the file, because it has the same name.
Even after excluding a directory? If you have autogenerated build folders (e.g. dist/, out/, etc) you have to mark them as Excluded: https://i.imgur.com/E2uXJzu.png
Odd. I haven't noticed that, but I'll watch out for it.
Hope they'll get their shit together, it used to be a pretty great IDE before these annoyances started piling up.