ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

Babel

by babel ST3 Top 100

Syntax definitions for ES6 JavaScript with React JSX extensions.

Details

Installs

  • Total 289K
  • Win 107K
  • OS X 135K
  • Linux 47K
Aug 22 Aug 21 Aug 20 Aug 19 Aug 18 Aug 17 Aug 16 Aug 15 Aug 14 Aug 13 Aug 12 Aug 11 Aug 10 Aug 9 Aug 8 Aug 7 Aug 6 Aug 5 Aug 4 Aug 3 Aug 2 Aug 1 Jul 31 Jul 30 Jul 29 Jul 28 Jul 27 Jul 26 Jul 25 Jul 24 Jul 23 Jul 22 Jul 21 Jul 20 Jul 19 Jul 18 Jul 17 Jul 16 Jul 15 Jul 14 Jul 13 Jul 12 Jul 11 Jul 10 Jul 9 Jul 8
Windows 194 281 129 180 240 224 285 270 224 149 169 234 268 295 274 321 156 175 259 272 314 294 266 144 176 231 298 276 327 253 180 164 245 281 284 319 283 130 187 285 301 281 296 347 176 168
OS X 164 298 130 161 281 238 311 304 298 138 170 277 295 353 299 330 129 162 231 303 314 333 305 188 183 276 291 290 346 313 161 159 246 352 335 300 321 146 144 272 342 347 335 348 161 165
Linux 61 89 64 60 83 91 94 102 89 57 61 89 111 112 118 108 74 76 85 109 114 99 99 71 86 90 120 118 103 97 72 64 91 98 127 126 105 75 64 112 103 103 131 97 68 81

Readme

Source
raw.​githubusercontent.​com

babel-sublime

Only supports Sublime Text 3. Sublime Text 2 is no longer supported.

Language definitions for ES6+ JavaScript with React JSX syntax extensions.

Installation

Find it as Babel through Package Control.

Setting as the default syntax

To set it as the default syntax for a particular extension: 1. Open a file with that extension, 2. Select View from the menu, 3. Then Syntax -> Open all with current extension as... -> Babel -> JavaScript (Babel). 4. Repeat this for each extension (e.g.: .js and .jsx).

Setting a Color Scheme

Babel comes bundled with Next and Monokai from Benvie/JavaScriptNext.tmLanguage. Select one from Preferences -> Color Scheme -> Babel

Advanced usage

It's possible to set Babel as the only JavaScript package by disabling the stock one. To do so, add "ignored_packages": ["JavaScript"] to your Preferences.sublime-settings. The benefits include: * extension-less node scripts will automatically be recognized as JavaScript (Babel), * and reduced clutter in the syntax menu.

Keep in mind, the stock snippets will no longer work (you may still use your own), and other third-party packages that depend on the stock package may break (no known ones so far).

Screenshots

babel-sublime-vs-sublime-react--react-class

babel-sublime-vs-sublime-react--jsx-comments-etc

  • babel-sublime correctly matches JSX comments between attributes, namespaced components, and non-alpha characters in tag/attribute names.

babel-sublime-vs-sublime-react--jsx-tight

  • Greater-/less-than comparisons are correctly identified as such and not mistaken for JSX tags.

Snippets

Find them separately at babel/babel-sublime-snippets or as Babel Snippets through Package Control.

Suggested Resources

Sublime Text Color Schemes which are ready for JavaScript's new features and babel-sublime package.

Oceanic Next Color Scheme

Zeus Color Scheme

zeus-color-scheme

About

Under the hood, babel-sublime is based on the excellent Benvie/JavaScriptNext.tmLanguage with JSX syntax support built on top. The initial definitions for JSX came from reactjs/sublime-react via yungters/sublime - special thanks go to @jgebhardt and @zpao.

Contributing

Pull Requests should include your changes to the respective YAML-tmKittens file as well as the converted tmKittens file. Use AAAPackageDev to convert the YAML-tmKittens files.