React.js files syntax in sublime text 3

Question

i am using sublime text 3 as my code editor,i have written a basic hello world example in React.but the coloring is improper on the code ,i have tried installing Babel plugin but even after that also the coloring doesn't seem to work ,as you can see the image below

Solution 1

Just installing it isn't enough, you have to also tell SublimeText to use it.

Either do

a) Ctrl-Shift-P, type "Babel" and select Set Syntax: Javascript(Babel)

or

b) Go to the menu and do View->Syntax->Open all with current extension as...->Babel->Javascript(Babel).

Solution 2

You could follow the below mentioned steps:-

Setting babel 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

Courtesy: https://github.com/babel/babel-sublime

Solution 3

This might possibly help you out...follow below steps

1. press Ctrl + Shift + P
2. Doing so, Command Palette pops up and there type : Package control . And then select the option Package Control: install package
3. Now typein and select 'Babel'
4. Now open 'View' menu and Navigate to Syntax, Open all with current extension as…, Babel, Javascript (Babel).

Comments

[Alexandre Borela]

You may want to try this new syntax github.com/borela/naomi as it supports ES2017+ features.