CODEWITHSUNDEEP
javascriptreactjssublimetext3
Tiago Bértolo
Tiago Bértolo

Reputation: 4333

How to fix Sublime text highlighting for react-tutorial?

I recently started the official reactjs tutorial and noticed that the sublime text highlighting is completely screwed.

enter image description here

How can i fix this?

Upvotes: 20

Views: 8254

Answers (4)

user9684800
user9684800

Reputation:

  • Follow this link to install the package manager for sublime text
  • Now to open the command palette, press ctrl+shift+p (Win, Linux) or cmd+shift+p (OS X). From the search results select Package Control: Install Package. Now find and select packages Babel and Babel Snippets.
  • Now to enable proper syntax highlighting for your JSX code, open your .js/.jsx file, select View -> Syntax -> Open all with current extension as... -> Babel -> JavaScript (Babel).

Upvotes: 4

Computer's Guy
Computer's Guy

Reputation: 5353

Install babel with the package control package, if you don't have it, get it here.

Open the package control, select install package, type babel, select it and press enter.

Setting as the default syntax

To set it as the default syntax for a particular extension:

  • Open a file with that extension, Select View from the menu, Then Syntax -> Open all with current extension as... -> Babel -> JavaScript (Babel). 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

Upvotes: 42

Pranesh Ravi
Pranesh Ravi

Reputation: 19113

Install babel via the package control. It'll fix the syntax highlighting and adds few more features.

check https://packagecontrol.io/packages/Babel

Upvotes: 2

Mike D
Mike D

Reputation: 251

Installing the following sublime package should fix those problems:

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

Upvotes: 2

Related Questions