Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
console.log() key binding for Sublime Text

Go to Sublime Text 2 > Preferences > Key Bindings - User and add this JSON to the file:

[
    { "keys": ["super+shift+l"],
      "command": "insert_snippet",
      "args": {
        "contents": "console.log(${1:}$SELECTION);${0}"
      }
    }
]

Inserts a console.log() at the current cursor position, tab once to jump past.

@ttscoff

This comment has been minimized.

Copy link

ttscoff commented Jun 18, 2012

Very cool. I'd add a context match for javascript, so you can add additional logging styles based on the language:

    { "keys": ["super+shift+l"],
      "command": "insert_snippet",
      "args": {
        "contents": "console.log(${1:}$SELECTION);${0}"
      }, "context":
      [
        { "key": "selector", "operator": "equal", "operand": "source.js", "match_all": true }
      ]
    },
    { "keys": ["super+shift+l"],
      "command": "insert_snippet",
      "args": {
        "contents": "NSLog(@\"${1:}$SELECTION\"$2);\n${0}"
      }, "context":
      [
        { "key": "selector", "operator": "equal", "operand": "source.objc", "match_all": true }
      ]
    }
@RadioactiveMouse

This comment has been minimized.

Copy link

RadioactiveMouse commented Jun 19, 2012

Works like a charm, thanks. Now just to resist reducing a lot of stuff to snippets....

@grantgeorge

This comment has been minimized.

Copy link

grantgeorge commented Jun 11, 2014

dope, thanks!

@jamesrichards

This comment has been minimized.

Copy link

jamesrichards commented Jul 9, 2014

Exactly what I was after - thank you.

@PavelPolyakov

This comment has been minimized.

Copy link

PavelPolyakov commented Dec 26, 2014

@ttscoff

Hi man, thanks for your version of the key binding.
Just one question - how should I adjust it to have it working in the html files as well as ? (even outside the <script><script> block)?

I've tried several variants, but haven't succeed.

Regards,

@reydi

This comment has been minimized.

Copy link

reydi commented Mar 31, 2015

where can i find the documentation for defining the args? how can i know about ${1:}? $SELECTION? ${0}? been googling and found the official documentation here http://sublime-text-unofficial-documentation.readthedocs.org/en/latest/customization/key_bindings.html but didn't find the answer :(

@alexsaw

This comment has been minimized.

Copy link

alexsaw commented Jan 3, 2016

Awesome. Exactly what I needed. Thank you!

@yeomann

This comment has been minimized.

Copy link

yeomann commented Feb 9, 2016

thank mate!

@andrewcbass

This comment has been minimized.

Copy link

andrewcbass commented Feb 25, 2016

Thanks! Keyboard shortcuts for the win.

@laoyipay

This comment has been minimized.

Copy link

laoyipay commented Apr 6, 2016

Thanks!

@dannyn-mirth

This comment has been minimized.

Copy link

dannyn-mirth commented Apr 27, 2016

Does anyone know how to insert a newline first, then insert the snippet on the new line?

This is useful when I want to select a variable and just the shortcut to console log on the next line. This current implement does it in-line which breaks syntax.

@aziaziazi

This comment has been minimized.

Copy link

aziaziazi commented Dec 11, 2016

My update to print valueName => value with two cursors : console.log('CURSOR => ',CURSOR)

[
    { "keys": ["super+shift+l"],
      "command": "insert_snippet",
      "args": {
        "contents": "console.log('${1:}$SELECTION => ',${1:}$SELECTION);${0}"
      }
    }
]
@Unkas82

This comment has been minimized.

Copy link

Unkas82 commented Feb 17, 2017

You saved my time! thx

@codezyc

This comment has been minimized.

Copy link

codezyc commented Mar 24, 2017

can't insert in newLine?

@ryanbsherrill

This comment has been minimized.

Copy link

ryanbsherrill commented May 12, 2017

Super awesome. Thank youuuuu

@schester44

This comment has been minimized.

Copy link

schester44 commented Jul 24, 2017

you can insert a new line using \n

@aegiz

This comment has been minimized.

Copy link

aegiz commented Sep 4, 2017

Fantastic 👍

@112KA

This comment has been minimized.

Copy link

112KA commented Sep 29, 2017

Using macro, you can output a new line console.log.
https://gist.github.com/112KA/acfd03d6ac9edcd0154932fc055e6c0d

@Avcajaraville

This comment has been minimized.

Copy link

Avcajaraville commented Nov 6, 2017

Thanks !

@msman

This comment has been minimized.

Copy link

msman commented Mar 28, 2018

very cool

@totalBenjick

This comment has been minimized.

Copy link

totalBenjick commented Jul 19, 2018

how this works exactly? I have ubuntu in a Spanish keyboard

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.