CODEWITHSUNDEEP
javascriptsublimetext2
Robeezy
Robeezy

Reputation: 2464

Sublime Text 2: Auto fix indentation for javascript?

Here's some sample code I have, currently I'm set to only indent using 4 spaces at a time. Is there a way to highlight a block of javascript and press a single button or menu option to format it nicely like so:

Before:

app.get('/csvtest', function (req, res) {
  MyModel.find(function (err, mymodel) {
    if (!err) {
      var csv = [];
      _.each(mymodel, function(obj) {
       csv.push(obj['mymodel']);
      });
      res.send(csv.join());
    } else {
      console.log(err);
    }
  });
});

After:

app.get('/csvtest', function (req, res) {
    MyModel.find(function (err, mymodel) {
        if (!err) {
            var csv = [];
            _.each(mymodel, function(obj) {
                csv.push(obj['mymodel']);
            });
            res.send(csv.join());
        } else {
            console.log(err);
        }
    });
});

Upvotes: 75

Views: 92468

Answers (7)

Robert Karl
Robert Karl

Reputation: 7816

Here is a tool for this. Found it on the sublime forums.

  • Install Package control
  • Run Package Control: Install Package from the command palette. Type Ctrl + Shift + P (Windows) or Command + Shift + P to open the command palette
  • Search for jsFormat and hit enter
  • Ctrl + Alt + f to format

Upvotes: 150

Bubbles
Bubbles

Reputation: 3815

You could give JsFormat a go. ctrl+alt+f formats the selected text.

Upvotes: 40

Gokhan Tank
Gokhan Tank

Reputation: 3786

You can select all your code (ctrl+A) and use the in-app functionality, Reindent (Edit -> Line -> Reindent). It will format your code with looking at the Sublime's tab/intent setting.

Alternatively: You can use JsFormat formatting plugin for Sublime Text 2 if you would like to have more customizable settings on how to format your code to addition to the Sublime Text's default tab/indent settings.

https://github.com/jdc0589/JsFormat

More info how to install JsFormat to your Sublime IDE: You can easily install JsFormat with using Package Control (Preferences -> Package Control) Open package control then type install, hit enter. Then type "js format" and hit enter, you're done. (The package controller will show the status of the installation with success and errors on the bottom left bar of Sublime)

Setting the short cut: Add the following line to your key bindings (Preferences -> Key Bindings User)

{ "keys": ["ctrl+alt+2"], "command": "js_format"}

I'm using ctrl+alt+2, you can change this short cut key whatever you want to.

My opinion: JsFormat is a good one, definitely worth to try it!

Upvotes: 37

James Rutledge
James Rutledge

Reputation: 191

It looks like Sublime Text 2 already has what you want (maybe they added this feature more recently).

Whether you're wanting to change the number of Spaces or you're wanting to convert Spaces to Tabs, you can use this path: View > Indentation

Within that dropdown menu you have the option to Convert Indentation to Tabs, to Convert Indentation to Spaces, or to choose how many Spaces the Tab Width (1-8) should be.

Hope this helps!

Upvotes: 1

cosbor11
cosbor11

Reputation: 16024

Install jsFormat using PackageControl by selecting jsFormat from the Install Package menu.

Then do this to auto-format your code:

Ctrl + Alt + F

It is also helpful to review the jsLint recommendations for formatting. You can install the jsLint package and validate with formatting options enabled.

Ctrl + L

Upvotes: 0

Ryall
Ryall

Reputation: 12281

The fastest way to do this, in general, is with a regex:

  • Press CTRL+H
  • Enable the Regular Expression button to the bottom-left (or press ALT+R)
  • Enter ^(\s+) in Find What
  • Enter \1\1 in Replace With
  • Click Replace All to the right

This will double the number of prefixed spaces (bringing 2 spaces to 4). The replace window can then be left open to easily apply this to multiple files.

Upvotes: 2

Evan Davis
Evan Davis

Reputation: 36592

If you specifically want to go from 2 to 4 spaces, click on the tab menu in the lower right corner. Click "convert indentation to tabs", change width to 4, then "convert indentation to spaces."

Upvotes: 7

Related Questions