This content originally appeared on DEV Community and was authored by Colin Fiedorowicz
Introduction
I love how Microsoft's Python and Debugger for Java extensions make testing Python and Java code as easy as pressing a single key (F5, to be more specific). I used to use Code Runner for running my Node.js apps, but I hated how it added an extra context menu item for running Java and Python code. Since the Microsoft extensions already add their own context menu items, I felt that Code Runner's addition was redundant. Eventually, the extra item annoyed me so much that I uninstalled Code Runner and began using the command line to run my Node.js apps.
Little did I know that there was an easier way in front of me the entire time. In fact, it comes with every copy of VSCode! It turns out that VSCode comes with a built-in extension for running and debugging both Node.js and browser-based JavaScript. That's right, it was literally in front of me all along!
In this article, I'll teach you how to use VSCode's built-in JavaScript debugger to run your Node.js apps.
Okay, So How Do You Run Them?
VSCode has two places where you can run your Node.js apps: the debugging console and the integrated terminal. There's an important reason why you might need to use the integrated terminal instead of the debugging console. While it suffices for most situations, the debugging console can't take user input. Thus, you might wish to use the integrated terminal to run most (if not all) of your apps.
This tutorial has two parts. The first part teaches you how to run your Node.js apps in the debugging console, and the second part teaches you how to run them in the integrated terminal. Even if you never plan on using the debugging console, you should still read the first part of the tutorial because the second part builds off of it.
The Debugging Console
-
In VSCode, open the directory containing your app. Then navigate to the Run and Debug view in the activity bar.
-
In the Run and Debug view, click on the text that says "create a launch.json file." Launch files contain special settings that tell VSCode how to run files in the debugger.
-
Once you click on the text, you'll be prompted to select a debugger. Since you'll be running a Node.js app, you should choose
Node.js.
-
Once you select the Node.js debugger, it'll automatically create and open a
launch.jsonfile which will have the following properties:
{ "version": "0.2.0", "configurations": [ { "type": "pwa-node", "request": "launch", "name": "Launch Program", "skipFiles": [ "<node_internals>/**" ], "program": "${workspaceFolder}/app.js" } ] }The object in the array for the
"configurations"property contains the most relevant properties, so I'll explain each of its keys and acceptable values:- The
typekey stores which debugger VSCode should use. In this case, it's set to"pwa-node"—the Node.js debugger. You can also set it to either"pwa-chrome"or"pwa-msedge", allowing you to run web apps in Google Chrome and Microsoft Edge, respectively. It's important to mention that these aren't the only debuggers you can use; you can and"attach". In this case, it's set to the former, meaning VSCode will attach the debugger to a new instance of your app. When set to the latter, VSCode will attach the debugger to an app or process that's already running. - The
namekey is self-explanatory: it stores the configuration's name. The ability to name them comes in handy when you must run multiple debuggers on a single project. Configuration names appear in the Run and Debug view when selecting one to run. In this case, the configuration is named "Launch Program," but there's nothing wrong with giving it a different name like "Run Node.js App." - The
skipFileskey stores an array of glob patterns indicating files that the debugger should skip. In this case, it's value tells the VSCode debugger to skip internal Node.js files - The
programkey stores the absolute path of you're Node.js app. It's important to mention that VSCode has various predefined variables which store file paths that most programmers regularly use. In this case, the path uses the${workspaceFolder}variable, which stores the workspace's directory.
- The
-
Once VSCode creates the launch file, feel free to close it.
-
Now you're ready to run your Node.js app! You can run it by either pressing F5 or clicking the green arrow button in the Run and Debug view.
-
VSCode will automatically open the debug console and run your program.
The Integrated Terminal
-
Add the following line to your launch configuration.
"console": "integratedTerminal",Once you do, you're
launch.jsonfile should look like this:
{ "version": "0.2.0", "configurations": [ { "type": "pwa-node", "request": "launch", "name": "Launch Program", "skipFiles": [ "<node_internals>/**" ], "program": "${workspaceFolder}/app.js", "console": "integratedTerminal", } ] }The
consolekey stores which console VSCode should use for debugging. It uses the debugging console by default, but we've now set it to use the integrated terminal. Once you add the line to your
launch.jsonfile, feel free to close it.You can run your app by either pressing F5 or clicking the Start Debugging button—just like you would if you were running it in the debugging console.
-
VSCode will automatically open a new integrated terminal and run your program.
That's that; you now know how to run Node.js apps in VSCode! If you want to learn more about debugging Node.js apps in VSCode, then visit the VSCode documentation website.
This content originally appeared on DEV Community and was authored by Colin Fiedorowicz
Colin Fiedorowicz | Sciencx (2022-06-23T20:06:13+00:00) How to Run Node.js Apps in VSCode—without Code Runner!. Retrieved from https://www.scien.cx/2022/06/23/how-to-run-node-js-apps-in-vscode-without-code-runner/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.