Console API Snippets (JavaScript)
JavaScript Console API Snippets for Sublime Text
Details
Installs
- Total 25K
- Win 17K
- Mac 5K
- Linux 3K
Jun 3 | Jun 2 | Jun 1 | May 31 | May 30 | May 29 | May 28 | May 27 | May 26 | May 25 | May 24 | May 23 | May 22 | May 21 | May 20 | May 19 | May 18 | May 17 | May 16 | May 15 | May 14 | May 13 | May 12 | May 11 | May 10 | May 9 | May 8 | May 7 | May 6 | May 5 | May 4 | May 3 | May 2 | May 1 | Apr 30 | Apr 29 | Apr 28 | Apr 27 | Apr 26 | Apr 25 | Apr 24 | Apr 23 | Apr 22 | Apr 21 | Apr 20 | Apr 19 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Windows | 0 | 1 | 1 | 0 | 0 | 0 | 0 | 1 | 2 | 0 | 2 | 2 | 1 | 1 | 0 | 0 | 3 | 2 | 1 | 0 | 1 | 0 | 0 | 0 | 0 | 0 | 3 | 0 | 0 | 2 | 0 | 1 | 1 | 0 | 2 | 0 | 1 | 0 | 0 | 1 | 2 | 1 | 1 | 0 | 2 | 2 |
Mac | 0 | 1 | 0 | 1 | 0 | 0 | 0 | 0 | 2 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 1 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 |
Linux | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 0 | 1 | 0 | 0 | 0 | 2 | 0 | 0 | 0 | 0 | 1 | 0 | 0 |
Readme
- Source
- raw.githubusercontent.com
JavaScript Console API Snippets for Sublime Text
This is a Sublime Text 2 package including a bunch of handy snippets for using the Console API of Firebug or other web Inspector tools in the browser of your choice.
Installation
With Package Control
If you have the Package Control package installed, you can install Console API Snippets from inside Sublime Text itself. Open the Command Palette and select »Package Control: Install Package«, then search for »Console API Snippets«.
It just works ; ]
… check this video if you still need assistance.
Without Package Control
If you haven't got Package Control installed (seriously, go install it!) you will need to make a clone of this repository into your packages folder, like so:
git clone https://github.com/mischah/Console-API-Snippets.git Console-API-Snippets
The packages folder is located here:
- Windows: %APPDATA%\Sublime Text 2\Packages
- OS X: ~/Library/Application Support/Sublime Text 2/Packages
- Linux: ~/.Sublime Text 2/Packages
- Portable Installation: Sublime Text 2/Data/Packages
… check this video if you still need assistance.
Or just download the package from download page here at github and copy the folder »Console-API-Snippets« to the packages folder on your machine.
Usage
- Just type »console« and hit the »Tab« key (⇥)
- Select one of the offered console methods with your cursor
- Hit the »Return« key (↵)
- Use Tab to jump through the placeholders and replace them accruing to your needs
You could also wrap console.time() and console.timeEnd() around existing code by opening the command palette (cmd ⌘ + shift ⇧ + P) and begin to type »console.time« and choose »Snippet: console.time()«.
About the Console API
You should have a look at »Firebug and Logging« to get an idea of how useful it is to know the different console methods. Or check the screencast »Become a Javascript Console Power-User« from Paul Irish.
The snippets I’m offering are based on the console object from Firebug. See Firebug Console API for details.
You could also have a look at these tutorials:
- Firebug Tutorial – Logging, Profiling And Commandline (Part I)
- Firebug Tutorial – Logging, Profiling And Commandline (Part II)
Different browsers, different capabilities
The implementation of the Console API are differing from browser to browser.
You don't have to worry when it comes to modern browsers like Chrome, Firefox, Safari and Opera. I’m not sure about IE9 and IE10, but especially the old version of Internet Explorer have a lack of console methods.
So you need a type of »Console Fix« to prevent, that browsers are throwing errors because of unknown methods.
A basic console fix:
The simplest way to accomplish that is to include a small snippet like the following in which you can define the missing methods you are using as »empty« methods to prevent errors.
if (!window.console) {
window.console = {
log : function (event) {},
info : function (event) {},
warn : function (event) {},
error : function (event) {}
};
}
A more advanced console fix
Mike Wilcox has a more advanced approach. See »JavaScript Console Fix V2«.
One last thing
You should avoid to deploy console output to your production server.
If you are using UglifyJS just use the compressor option drop_console
to get rid of console stuff in your code.
Author
Michael Kühnel ⤳ Interweb
License
Use it, change it, fork it, sell it. Do what you will, but please leave the author attribution.
Version history
Version 1.0 (10-10-2012)
- Initial release
Version 1.0.1 (10-22-2012)
- Add CoffeeScript support. Thanks to Allen Bargi
Version 1.0.2 (11-22-2012)
- Fix typo in readme and github pages
- Add screencast »Become a Javascript Console Power-User« to readme and github pages
Version 1.0.3 (09-08-2013)
- Add console.time wrapper which lets you wrap console.time statements around your selected code. Thanks to Joe Maller
Version 1.0.4 (11-10-2014)
- Simplify console.time wrapper. Thanks to PSeitz.
Version 1.0.5 (08-03-2015)
- Improve tabbing. Thanks to gaboesquivel.