/language-javascript-semantic

JavaScript Semantic Highlighting Package for Atom (NO LONGER MAINTAINED)

Primary LanguageJavaScriptMIT LicenseMIT

🔴 This project is on hold pending resolution of atom#8669. I'm tired of chasing an undocumented private API.


See Your JavaScript Code in a New Light

This Atom package enables semantic highlighting for JavaScript code. Identifiers are highlighted in different colors (the same identifier always in the same color) while everything else (like language keywords) is displayed in various shades of gray. This approach runs contrary to classical ideas about syntax highlighting but is rapidly becoming very popular.

With Dark Theme With Light Theme

In addition to being a useful tool for actual, productive JavaScript coding, the package also demonstrates some techniques that might serve other developers when creating similar packages for other languages:

  • Advanced use of Less to dynamically create a syntax theme that goes well with the existing one
  • A language grammar that is defined programmatically rather than through a .cson grammar file
  • Connecting an external parser (Acorn in this case)

Acorn is a mature, fast JavaScript parser that is available through npm. Unfortunately, the requirements for an Atom grammar necessitated two customizations:

  • Support for tokenizing unterminated multi-line comments (required to allow incremental, i.e. line-by-line, tokenizing)
  • Reverting to regex- rather than eval-based keyword recognition to work around Atom Shell's CSP restrictions (this problem is being tracked in acornjs/acorn#90)

As a result, this package ships with a modified version of Acorn, but it would be preferable if those issues could be worked out so that Acorn can be pulled from npm in the future.

Acknowledgments

Prior Art

Dependencies

  • Acorn: JavaScript parser

License

Copyright © 2014-2015 Philipp Emanuel Weidmann (pew@worldwidemann.com)

Released under the terms of the MIT License