JavaScript console in Sublime Text
Learning JavaScript can be a long and difficult journey. You can read tons of books and articles, attend reputable conferences and watch many videos but you are wasting your time if you won’t practice it. Google Chrome Javascript Console isn’t the most comfortable tool for sure. Tools like jsbin.com or jsfiddle.net are super cool but lets confirm that, nothing is more convenient to write a piece of code than your favourite editor. Let me share with you how you can test your JavaScript scripts and execute it via build systems feature in Sublime Text 3.
Build systems allows you to run your files through external programs without manually switching between code editor and Terminal. Sublime Text comes with few predefined profiles.
Our mission is to add a new one for JavaScript. We are going to use node.js. Make sure it is already installed on your device.
Create JavaScript build system in Sublime Text
Every built system is described on JSON file with .sublime-build extension. To create new one go to Tools > Build System > New Build System… If you are mac OS user, copy and paste this bit of code:
{
"cmd": ["/usr/local/bin/node", "$file"],
"selector": "source.js"
}
Windows users…
{
"cmd": ["C:/Program Files/nodejs/node.exe", "$file"],
"selector": "source.js"
}
In most cases single node command does the job instead of passing a full path to node. I found this method more reliable though. If you are not sure where node is installed, just type which node in Terminal (mac OS) or where node in command prompt (windows users) to get the path.
Save this file as a JavaScript.sublime-build in “User” directory inside Sublime Text settings folder.
Time for fun part. Create and save a JavaScript file (to execute a node interpreter, file needs to be saved), code some super amazing script and click Cmd + B (mac OS) or F7 (Windows). You can run this task manually from Tools > Build. Sublime Text should automatically run your script through appropriate build system. If something doesn’t work correctly go to Tools > Build System and make sure that Automatically or JavaScript is selected. Enjoy!
Pawel, thanks for the most detailed and correct instructions on how to execute javascript in Sublime editor I've seen. I spent hours of troubleshooting and trying to figure out what was wrong until I saw this post. Problem was each time when I tried testing my code I didn't save the file first. Just one question , using your method here is it possible to execute only one line of the code or more. So far I was able to execute only 1, am I doing something wrong here? Thanks
I'm really glad that you found this post useful. It shouldn't be a problem to execute longer chunks of code, but main purpose of this should be rather testing small quick snippets instead of testing entire applications. If you want to test some bigger bits of code I recommend to test it its 'natural environment'.
Really happy that this article helped! If you have any further questions, feel free to ask.
Hi Pawel,
Thank you for your instructions for a sublime text 3. I was trying to set it for a several days and still it doesn't work for me.
I installed package control by following an instruction and installed nodejs.
in Terminal:
After: $ node -v
I am getting: v6.9.2
$ which node
/usr/local/bin/node
After I saved simple program
function reverse(string) {
return string.split("").reverse().join("");
}
reverse("panama")
Tools => build system => node because I saved
{
"cmd": ["/usr/local/bin/node", "$file"],
"selector": "source.js"
}
as a node.sublime-build
press build
and get
[Finished in 0.1s]
in th console window
You are doing everything correctly :) The only missing thing is to log the returned from function result. Look :)
https://uploads.disquscdn.c...
Thank you so much!!!!
Happy holidays!
Forgot to say: IT IS WORKING!
[Error 2] The system cannot find the file specified
...
:/
I'm really sorry to see that it isn't working for you. Let me help you to set it up. Tell me what operating system are you on first?
It works for me. Thank you. Start to use node in Sublime Text 3 now. I am able to run a single node.js file for some function validation.
I'm glad it helped. Enjoy!
Thank you! I learned how to use "which", too!
I'm super glad that I helped. Enjoy!
hey there, i tried your instructions for sublime text 2 on mac, and it worked :D but now i'm trying it for sublime text 3 on windows 7, i'm getting this error when i save my js file:
[WinError 2] The system cannot find the file specified
[cmd: ['/usr/local/bin/node', 'C:\\Users\\user\\Desktop\\js\\recursive-function.js']]
[dir: C:\Users\user\Desktop\js]
[path: C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Skype\Phone\;C:\Program Files\nodejs\;C:\Users\user\AppData\Roaming\npm]
[Finished]
i'm not sure whats wrong.. is it a faulty install of nodejs that is causing this? :(
Hello. It looks like you have a wrong path to node inside your build system. You need to find a correct path where your node is installed and replace this string "/usr/local/bin/node" with your path.
it should be something like 'C:/Program Files/nodejs/node' instead of '/usr/local/bin/node'
[WinError 2] The system cannot find the file specified
[cmd: ['C:\\Users\\username\\node.exe', '']]
[dir: C:\Program Files (x86)\Sublime Text 3]
[path: C:\Program Files (x86)\NVIDIA Corporation\PhysX\Common;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files (x86)\Common Files\Acronis\SnapAPI\;C:\Program Files (x86)\Microsoft SQL Server\100\Tools\Binn\;C:\Program Files\Microsoft SQL Server\100\Tools\Binn\;C:\Program Files\Microsoft SQL Server\100\DTS\Binn\;C:\Program Files\MATLAB\R2014b\runtime\win64;C:\Program Files\MATLAB\R2014b\bin;C:\Program Files\MATLAB\R2014b\polyspace\bin;C:\Program Files\nodejs\;C:\Users\Amir\AppData\Roaming\npm]
[Finished]
i have the same problem here
can anybody help me plz?
See my comment above as possible solution.
Doesn't build, sorry.
😹😹😹
OK, it works on Ubuntu, too. Because the build config file is JSON, don't forget to use double quotes (").
I'm glad it works for you. Snippet above has double quotes :)
Yes, I just got used to typing the single quotes (they work in object literals).
Yes sir. Now you can use back-tick as and put some expression inside as well.
Works on Mac perfectly!
I'm glad it helped. Have a great day!
Can you tell me which kind of theme you used? Its very nice. Thank!
Hello. It is a "Spacegray". Feel free to grab my whole configuration file that is available here: https://github.com/pawelgrz...
Thank so much. I'll try it ;))
Hello..... you said that we need to find the right path. what do you mean by that??
the problem is this. and you said find the right path.... can you please direct us
[WinError 2] The system cannot find the file specified
[cmd: ['/usr/local/bin/node', 'C:\\Users\\Muhammad\\Desktop\\1.js']]
[dir: C:\Users\Muhammad\Desktop]
[path: C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\Program Files (x86)\ATI Technologies\ATI.ACE\Core-Static;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\]
[Finished]
See my comment above.
Windows users: SublimeText needs to know where to find a program that can run javascript. Use Winkey-R, type "cmd", and enter to open command prompt. Type "where node". The path it returns is what you should type into the config file in SublimeText. For me it was "C:/Program Files/nodejs/node.exe". If "where node" complains about not being found, you should download nodejs from nodejs.org (then use the above steps to point sublime to the installed exe).
Thank you for clarification. I'm not a Windows user so it was hard for me to reply to some commenters.
Your post helped me so glad to contribute to your blog. Cheers.
Please update your article with the "where" alternative for Windows user. i had to google-fu the problem until i reached the end of the post and saw this. Woulda saved me a good 10 minutes.
I just did it. Thanks for suggestion. I was planing that for some time because its quite popular post. Thanks a lot.
I update this article with snippet provided by you. Thanks a ton for your help again.
Thank you very much!
I'm glad you found this tutorial helpful!
Thanks!!
I had node installed through NVM so it didn't work for me at first, so I just switched the path to node like this:
first of all you can get the correct path by typing $ which node in your terminal
//original
{
"cmd": ["/usr/local/bin/node", "$file"],
"selector": "source.js"
}
//nvm path
{
"cmd": ["/Users/user/.nvm/versions/node/v4.4.7/bin/node", "$file"],
"selector": "source.js"
}
Exactly. As long a s the node path is correct its gonna work. Thanks for contribution Rick!
another way is ( tested on mac OS 10.13.1 and and ST3 build 3143)
- set alias for the version `nvm alias default 6.1.0` (whatever version)
- now create build system with just 2 lines
```
{
"shell_cmd": "node ${file}",
"selector": "source.js"
}
```
Thanks! Works on both my Mac and Windows laptops.
I'm really glad that you found it useful. Enjoy :)
Hi, complete noob here with this kind of stuff... Followed everything up until after I save it. I'm not really sure what to do after saving it or how to proceed. I'm using windows 10 by the way. I also downloaded the "Current" version of node.js, I don't know if that affects anything.
Hi Zak. As long as you did all the steps correctly and saved the build config file you should be able to execute your js file inside Sublime Text. Make sure that your file extension is .js. Then make sure that in menu Tools -> Build system is "Automatic" or "JavaScript". Then inside your file hit Ctrl + b. It should execute your file with no issue. File needs to be saved on hard drive beforehand.
Hi, thanks for your quick reply, your last sentence is what I didn't do. I just opened a new tab and saved it as xyz.js and retried and it worked. Thank you so much for the tutorial.
No worries, I'm glad I managed to help :)
sweet!, thanks!
I was wondering how to print/save the output of the build that showed up in the console. Modified a large bit of json in my file and wondering how to get it out.
Thank you very much. This worked like a charm.
I'm glad that it helped you out. Have a great day @Dark_Cappuccino:disqus
In Ubuntu 16.10, it's in "/usr/bin/"
~$ whereis node
node: /usr/bin/node /usr/share/man/man1/node.1.gz
~$ whereis nodejs
nodejs: /usr/bin/nodejs /usr/lib/nodejs /usr/include/nodejs /usr/share/nodejs /usr/share/man/man1/nodejs.1.gz
~$ which nodejs
/usr/bin/nodejs
Worked at Sublime Text 3, thanks for sharing. :)
I'm glad it helped you out. Enjoy :)
These are steps for a Windows 10 Home:
1. Download sublime text https://www.sublimetext.com/3 (it usually shows which one you need by black dot)
2. Download node.js at https://nodejs.org/en/ (Recommended for most users)
3. go to Tools > Build System > New Build System
4. save as Javascript in the “User” directory inside Sublime Text settings folder
{
"cmd": ["C:/Program Files/nodejs/node.exe", "$file"],
"selector": "source.js"
}5.to check it, follow the last paragraph of this article from
Time for fun part. Create and save.....
GOOD LUCK!
Thanks a lot for detailed instruction @vpak:disqus. Have a great day 😊
Thanks!!! Now it works)))
Awesome.. Works like charm!
Hi there!
This thing doesn't work on my computer (Windows 7).
I've done everything like you said: downloaded Node, found the way for it in command prompt, created a New Build System, pasted
{
"cmd": ["C:/Program Files/nodejs/node.exe", "$file"],
"selector": "source.js"
}
then saved it as a JavaScript.sublime-build in “User” directory inside Sublime Text settings.
After that I opened my saved .js file, pressed F7 and nothing happenes.
No errors. Nothing.
Please, help me!
Hi, no worries we will managed to get it work @yana_dzhi:disqus
First have a look at helpful comment by @vpak:disqus
http://disq.us/p/1f5m2jj
Is it any help for you? Make sure that you have a correct path to node, file is saved and script actually logs some output…
https://uploads.disquscdn.c... hey im trying this on mac and i have tried every possibility discussed here and its still not working, i made no mistake in following the instructions. but when i click "command +B" or even try to do it manually, nothing happens, it just says "no build system" right at the bottom where line and column is writtten. i have the unlimited trial version of sublime text 3. do i have to buy it for this to work? or is it something else. please helpp!!!!! the path is also correct.
Hi.
Apparently you are doing everything correctly. Before running a build process please make sure that your file is saved. Let me know if thats any help.
Thanks for reading an visiting my website.
its working now, i was not saving the code file as .js :P my bad.
Thanks :)
Thank you ... thanx :)
No worries, glad it helps :)
guys am a window user but am shock that am outputing the result of my code using ctrl+B.
anyway thanks is working.....
https://uploads.disquscdn.c... hey I'm using Ubuntu latest version and I'm unable to run it on sublime. It's showing me this error
[Errno 2] No such file or directory
[cmd: [u'/usr/local/bin/node', u'/home/nehasehrawat/Desktop/JavaScript/script.js']]
[dir: /home/nehasehrawat/Desktop/JavaScript]
[path: /home/nehasehrawat/bin:/home/nehasehrawat/.local/bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games:/snap/bin]
[Finished]
Please help!
On ubuntu 16.04 node path is /usr/bin/node, note /usr/local/bin/node, try `which node` as stated in post to check this out.
Hi, I got this error, tried a few times. still not working. pls help
C:\Users\Willie\Desktop\VariableTest:1
(function (exports, require, module, __filename, __dirname) { public class VariableTest {
^^^^^
SyntaxError: Unexpected token class
at createScript (vm.js:56:10)
at Object.runInThisContext (vm.js:97:10)
at Module._compile (module.js:542:28)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.runMain (module.js:604:10)
at run (bootstrap_node.js:389:7)
at startup (bootstrap_node.js:149:9)
[Finished in 0.1s]
If you need to edit your build settings, then just create a new one and overwrite the previous saved file.
https://uploads.disquscdn.c...
This is wired and I don't know where is wrong, only I can be sure of this：
C:\Program Files\nodejs\node.exe
Please save the file first and then execute a command please.
You are so right, sorry that's my fault.
Hahahaha...
"You are so right"
It happens very occasionally !
You save my ass here, thanks a lot.
This work like a charm in Win10 x64 / Sublime Text 3 / Node v6.11.2-x64
{
"cmd": ["node" , "$file"],
"selector": "source.js"
}
Remember to install node with PATH enabled option from node installer, so it can be globally available in the system as only "node" and not with full path C:\Program Files\nodejs\node.exe
Hope this can be helpful to someone! Cheers
Wow! Thanks for this. Incredibly useful.
Glad you like it bro ! Have a nice day 🐘💨
Thanks a lot. It was a great help. :)
Why is it not refresing after saving file? How to make it beign watch?
very nice, thanks
Greetings. Mac User here. I am dying for some help. Everytime I try to console.log something in Sublime I get the following error. Please Help. Thank you.
ReferenceError: app is not defined
at Object.<anonymous> (/Users/G-Rich/Desktop/app.js:1:63)
at Module._compile (module.js:641:30)
at Object.Module._extensions..js (module.js:652:10)
at Module.load (module.js:560:32)
at tryModuleLoad (module.js:503:12)
at Function.Module._load (module.js:495:3)
at Function.Module.runMain (module.js:682:10)
at startup (bootstrap_node.js:191:16)
at bootstrap_node.js:613:3
[Finished in 0.1s with exit code 1]
[cmd: ['/usr/local/bin/node', '/Users/G-Rich/Desktop/app.js']]
[dir: /Users/G-Rich/Desktop]
[path: /usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin]
Can your show me your example please?
Make sure that you save it on your hard-drive first please…
I got it to work. I just had to uninstall and delete the application support folder and re do it all. Thanks man.
using `import` and `export` is not working? How to resolve this?
gives error .
(function (exports, require, module, __filename, __dirname) { import { generateRandom } from './utility';
^^^^^^
SyntaxError: Unexpected token import
yes ..same problem
have you got the solution, now???
Hopefully it my tip above helps a bit :)
thanks it worked
You are running a node process in the background. It doesn't support `import` / `export` keywords yet. Use common js syntax `const test = require('test.js)`;
How to save as "user" default file in windows?
Sorry, I have no clue what are you talking about. Sorry :(
I can't save the script as "user" default.How to do that?
Unfortunately I am not a Windows user and I am helpless here. Look at the comments from multiple Win users underneath.
Ok
Work fine! Thank you.
I wonder if there is something similar for c
You definitely can using cl command but I would not see any benefit of working with C code in Sublime Text over decent IDE like CLion or Visual Studio.
https://msdn.microsoft.com/...
This worked perfectly, thank you SO much!!
I am glad my article helped you out. Enjoy :)
thanks it works for me too... you're a genius
Yes it works thanks
Clear and concise instructions about how to add node.js and be able to run Javascript within my SublimeText editor. Greatly appreciated.
I am glad you found it helpful. Have a lovely day :)
Thank you very much. This worked like a charm
Node JS Course in Chennai
Thanks for the detailed instructions. You've saved me tons of time! I've been looking all over this breakdown.
Super article. Thanks.
System cannot find the file specified...
This is the error message am getting. Can anyone figure out what could be wrong please?
Where is the Sublime Text settings folder on Mac?
Thank you very much, works fine
this is really nice and accurate. works for me on a windows and a mac system!
I am glad it helped you out.
in my sublime text under packages there is no user dictionary....plz reply
fuck it was hidden ....u should tell that too ...damn it took me a whole week just to do that
one thing more...do i need to save it as a JSON file
ahhh....at last i dont know what i do ...but its working absolutely fine.Thanks
I am glad that you figured it out eventually. I am very sorry but I am not a Sublime Text user anymore, I use VSCode nowadays.
Enjoy :)
Thanks
Schools Japans in the Working does MSU ands Tokyo University
ddd
i'm using elementaryOS , and found the configuration file at
/home/$/.config/sublime-text-3/Packages/User
Thanks for the tip for future elementaryOS users. Really appreciate it.
Have a fantastic day 🥑
It's working! thanx! , but I wanna know what is the selector option for ? like what does it do??
Very concise
Thanks, have a lovely day 🥑
Hi, there I tried for a long time but I am unable to run my javascript codes please help me to solve my problem. DPI mode: per-monitor v2 startup, version: 3211 windows x64 channel: stable executable: /C/Program Files/Sublime Text 3/sublime_text.exe working dir: /C/Program Files/Sublime Text 3 packages path: /C/Users/HP/AppData/Roaming/Sublime Text 3/Packages state path: /C/Users/HP/AppData/Roaming/Sublime Text 3/Local zip path: /C/Program Files/Sublime Text 3/Packages zip path: /C/Users/HP/AppData/Roaming/Sublime Text 3/Installed Packages ignored_packages: ["Vintage"] generating syntax summary generating meta info summary pre session restore time: 25.55 startup time: 25.914 first paint time: 25.918 Unable to open /C/Users/HP/Desktop/website/portfolio/MY2.js reloading plugin Default.arithmetic reloading plugin Default.auto_indent_tag reloading plugin Default.block reloading plugin Default.colors reloading plugin Default.comment reloading plugin Default.convert_color_scheme reloading plugin Default.convert_syntax reloading plugin Default.copy_path reloading plugin Default.detect_indentation reloading plugin Default.echo reloading plugin Default.exec reloading plugin Default.fold reloading plugin Default.font reloading plugin Default.goto_line reloading plugin Default.history_list reloading plugin Default.indentation reloading plugin Default.install_package_control reloading plugin Default.kill_ring reloading plugin Default.mark reloading plugin Default.new_templates reloading plugin Default.open_context_url reloading plugin Default.open_in_browser reloading plugin Default.pane reloading plugin Default.paragraph reloading plugin Default.paste_from_history reloading plugin Default.profile reloading plugin Default.quick_panel reloading plugin Default.rename reloading plugin Default.run_syntax_tests reloading plugin Default.save_on_focus_lost reloading plugin Default.scroll reloading plugin Default.set_unsaved_view_name reloading plugin Default.settings reloading plugin Default.show_scope_name reloading plugin Default.side_bar reloading plugin Default.sort reloading plugin Default.switch_file reloading plugin Default.symbol reloading plugin Default.transform reloading plugin Default.transpose reloading plugin Default.ui reloading plugin CSS.css_completions reloading plugin Diff.diff reloading plugin HTML.encode_html_entities reloading plugin HTML.html_completions reloading plugin ShellScript.ShellScript reloading plugin 0_package_control_loader.00-package_control reloading plugin Add Folder To Project.AddFolderToProject reloading plugin Package Control.1_reloader reloading plugin Package Control.2_bootstrap reloading plugin Package Control.Package Control reloading plugin JavaScript Completions._generated_2018_02_11_at_20_21_24 reloading plugin JavaScript Completions.reloader plugins loaded Package Control: Fetching list of available packages and dependencies Platform: windows-x64 Sublime Text Version: 3211 Package Control Version: 3.4.1 Package Control: Download Debug URL: https://packagecontrol.io/channel_v3.json Timeout: 30 Resolved IP: 50.116.34.243 Resolved IPv6: 2600:3c02::f03c:91ff:fedf:6883 Package Control: WinINet Debug Proxy proxy: proxy bypass: proxy username: proxy password: Package Control: WinINet HTTPS Debug General Server SSL Certificate: subject: packagecontrol.io issuer: US, DigiCert Inc, www.digicert.com, RapidSSL RSA CA 2018 common name: packagecontrol.io issue date: Fri, 22 Nov 2019 05:30:00 GMT expire date: Tue, 21 Dec 2021 17:30:00 GMT Package Control: WinINet HTTPS Debug Write GET /channel_v3.json HTTP/1.1 User-Agent: Package Control v3.4.1 Host: packagecontrol.io Connection: Keep-Alive Cache-Control: no-cache If-Modified-Since: Wed, 09 Jun 2021 17:00:03 GMT If-None-Match: "60c0f393-521b4" Accept-Encoding: bzip2,gzip,deflate Package Control: WinINet HTTPS Debug Read HTTP/1.1 200 OK Server: nginx Date: Wed, 09 Jun 2021 22:31:17 GMT Content-Type: application/json Content-Length: 342009 Last-Modified: Wed, 09 Jun 2021 22:30:04 GMT Connection: keep-alive ETag: "60c140ec-537f9" Content-Encoding: bzip2 Vary: Accept-Encoding Strict-Transport-Security: max-age=15552000 Accept-Ranges: bytes Package Control: Caching https://packagecontrol.io/channel_v3.json in C:\Users\HP\AppData\Local\Sublime Text 3\Cache\Package Control\http_cache\01524fae79697630d0454ba3fabd9414 Package Control: Fetching list of available packages and dependencies Platform: Windows-x64 Sublime Text Version: 3211 Package Control Version: 3.4.1 Package Control: WinINet HTTPS Debug General Closing connection to packagecontrol.io on port 443 after 1 request Package Control: No updated packages reloading settings Packages/User/Package Control.sublime-settings
I am so sorry, but I am not a ST user anymore and I am not a Windows user. I am sure if you browse the comments under this post, you may find something helpful. Sorry satyaprakash singh 😔
Thanks a lot
Thank you so much brooooooooooooooo Come in Italy, I will give you a proper meal xD
Hahaha, actually me and my girlfriend are planning to visit Italy for the first time in our lives very soon. Would be awesome to hook up with some local geeks!
Thanks for the help! It's work for me, cool!
I am glad it helped you out. Enjoy!
It worked for some time.After a while i got error ''gcc' is not recognized as an internal or external command, operable program or batch file.'How to fix it.
I am afraid that it has nothing to do with the JavaScript execution in Sublime Text. GCC is a C++ binary and this is the space that I suggest exploring to mitigate your issue.
Sorry, I have a problem: OpenSSL configuration error: 70270000:error:80000002:system library:BIO_new_file:No such file or directory:c:\ws\deps\openssl\openssl\crypto\bio\bss_file.c:67:calling fopen(C:\Program Files\PostgreSQL\psqlODBC\etc\openssl.cnf, rb) 70270000:error:10000080:BIO routines:BIO_new_file:no such file:c:\ws\deps\openssl\openssl\crypto\bio\bss_file.c:75: 70270000:error:07000072:configuration file routines:def_load:no such file:c:\ws\deps\openssl\openssl\crypto\conf\conf_def.c:179:
Im on windows, I check the path and is correct. What can I do? help :c
Sorry Haziel, but I am not a Windows user :( Can't help here :(
Used the build system in Sublime text 4 { "cmd": ["/usr/local/bin/node", "$file"], "selector": "source.js" } Yet the console shows nothing even with console.log() And when I click “show console” in the view option on the main menu it shows exactly:
Running /usr/local/bin/node
Pls someone assist me I am just a beginner
Sorry. I changes my editor a few years ago to Visual Studio Code.