Different comment styles in different colors on JS


#1

I want to set different color to /** this comment */ and //this one

A question has been asked here about language-c. But I don’t find the way to do it with javascript.

I guess the comments are coded in this package "language-javascript image

I opened the “config folder” (under settings), but did not find this package. So my first question is where is it installed?

I found it on GitHub here. But I don’t know what I should do then. Any advice would be appreciated!


#2

Just like with language-c, language-javascript applies a block scope to block comments. You take advantage of this by adding rules to your styles.less (File -> Stylesheet...) to change the color, like so:

.syntax--comment.syntax--block {
  color: cadetblue;
}

#3

Thank you so much for taking to show me by finding the right line in the code!

(I can’t believe it… That’s simply amazing!)

Just by curiosity why this package isn’t in the package folder (and where is it installed)?


#4

The package folder is for community packages, and I couldn’t find the core ones. If you want to edit a core package, you can do so like any other. If you just want to look over it, the GitHub page should suffice. You also can clone it, and use Atom to explore it if you like.

Some packages are “compiled” using build tools (so the actual directory structure will be different to what you see on GitHub), but most aren’t. The only one I know of is first-mate, and it’s not even a core package.


#5

I believe the core packages are all in atom/app-x.xx.x/resources/app.asar, which can be easily extracted if you install the asar tool. However, that’s not something you need or want to do, since the source code is all available online, the GitHub repos have ongoing development work and the current stable versions, and if you want to override a core package, Atom makes it very easy to do so. All you need to do to override a core package is to download the package code to your computer (this is easiest and most powerful if you use git) and then, in a command line window pointing at the directory where you have stored the package, use apm link. APM will create a symbolic link inside .atom/packages/ that points at the folder you’re currently in, and if it’s a valid package with the same name as a core package, Atom will load your package instead of the core package.

This is not something that novice users should engage in, but for people with enough comfort with Atom to “void the warranty” and identify when their changes are the ones causing problems, it’s a very powerful tool for customizing the editor. I’ve used it to contribute to a couple of core Atom packages when there was a change that I felt comfortable making.


How can I edit core packages?
#6

Thanks! Your answer on this specific topic deserves more visibility, so I put it here