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

Babel

by babel ST3 Trending Top 100

Syntax definitions for ES6 JavaScript with React JSX extensions.

Details

Installs

  • Total 628K
  • Win 268K
  • Mac 253K
  • Linux 106K
Apr 8 Apr 7 Apr 6 Apr 5 Apr 4 Apr 3 Apr 2 Apr 1 Mar 31 Mar 30 Mar 29 Mar 28 Mar 27 Mar 26 Mar 25 Mar 24 Mar 23 Mar 22 Mar 21 Mar 20 Mar 19 Mar 18 Mar 17 Mar 16 Mar 15 Mar 14 Mar 13 Mar 12 Mar 11 Mar 10 Mar 9 Mar 8 Mar 7 Mar 6 Mar 5 Mar 4 Mar 3 Mar 2 Mar 1 Feb 29 Feb 28 Feb 27 Feb 26 Feb 25 Feb 24 Feb 23
Windows 89 187 204 134 147 163 156 195 182 155 170 157 168 200 188 191 194 131 154 137 153 177 161 180 122 100 137 178 155 159 195 104 134 144 145 152 170 165 123 133 177 188 126 147 150 105
Mac 46 130 188 91 82 120 97 115 109 105 82 86 104 107 94 97 101 97 98 69 108 97 101 85 72 63 76 88 104 96 117 52 72 85 103 127 133 100 59 74 98 106 102 118 116 61
Linux 22 63 84 54 51 51 63 57 86 71 67 54 63 62 76 55 65 43 45 57 74 69 76 77 39 60 43 55 57 68 62 49 33 65 65 74 52 64 34 48 59 66 62 58 69 44

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.