Downloaded 16 times
![“
”
Instead of making them [Linux
and Mac developers] go to
Windows, we want to meet
them where they are.
S. “Soma” Somasegar – Microsoft - Corporate VP of Developer Division
Quote retrieved from http://tcrn.ch/1PwSw1r
4](https://image.slidesharecdn.com/introtojavascripttoolinginvscode-devobjective-160623225848/85/Intro-to-JavaScript-Tooling-in-Visual-Studio-Code-4-320.jpg)
![“
”
Instead of making them [Linux
and Mac developers] go to
Windows, we want to meet
them where they are.
S. “Soma” Somasegar – Microsoft - Corporate VP of Developer Division
Quote retrieved from http://tcrn.ch/1PwSw1r
4](https://image.slidesharecdn.com/introtojavascripttoolinginvscode-devobjective-160623225848/75/Intro-to-JavaScript-Tooling-in-Visual-Studio-Code-4-2048.jpg)
Uploaded byColdFusionConference
Intro to JavaScript Tooling in Visual Studio Code
The document provides an introduction to JavaScript tooling in Visual Studio Code (VS Code), detailing its launch, features, and notable JSON configuration files such as jsconfig.json and launch.json. It emphasizes the lightweight, cross-platform capabilities of VS Code, its integration with task runners like Grunt and Gulp, and the support for Node.js debugging. Additional resources and tips are also mentioned to enhance the user experience with VS Code.
More Related Content
Similar to Intro to JavaScript Tooling in Visual Studio Code
![Java script nirvana in netbeans [con5679]](https://cdn.slidesharecdn.com/ss_thumbnails/javascriptnirvanainnetbeanscon5679-160927041807-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
![[4developers2016] The ultimate mobile DX using JS as a primary language (Fato...](https://cdn.slidesharecdn.com/ss_thumbnails/ultimatedxusingjsasaprimarylanguage2-160531144318-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
Intro to JavaScript Tooling in Visual Studio Code
- 1. Intro to JavaScriptTooling in Visual Studio Code @scott_addie
- 2. About VS Code Launched on April 29, 2015 at //Build/ conference Current = v1.2.1 Free product Lightweight Microsoft’s 1st cross-platform code editor 2
- 3. Based onGitHub’s Electron shell Designed by engineers who created: Eclipse @ IBM Monaco @ Microsoft Built w/ web technologies About VS Code (cont.) 3 IDEEditor
- 4. “ ” Instead of makingthem [Linux and Mac developers] go to Windows, we want to meet them where they are. S. “Soma” Somasegar – Microsoft - Corporate VP of Developer Division Quote retrieved from http://tcrn.ch/1PwSw1r 4
- 5. 5 Git Repo Branch CommandPalette Git Tools Debugger File Search File Explorer Output Window
- 6.
- 7.
- 8. 4 Notable JSONConfiguration Files 8 File Name Location Common Uses jsconfig.json Project root or subfolder Enable ECMAScript version support launch.json .vscode/ Debugger configuration settings.json .vscode/ - or - %APPDATA%CodeUser Override editor settings tasks.json .vscode/ Define custom tasks to run w/ built-in task runner
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15. Library / FrameworkIntelliSense Reliance on type definitions Deprecated: TSD Shiny: Typings > npm install –g typings *.d.ts files provide metadata to editor Angular, Gulp, React, etc. 15
- 16. Enable IntelliSense viatsd 16
- 17. Enable IntelliSense viatypings 17
- 18.
- 19. let demo =+ ; Demo Adding Node.js & Webpack Type Definitions 19
- 20. JS Task Runners Command Palette Discoverable Launchable 1st class support for: Grunt Gulp Jake Terminate running tasks: >Tasks: Terminate Running Task 20
- 21.
- 22. let demo =+ ; Demo Discovering, Launching, & Debugging Gulp Tasks 22
- 23. Native Task Runner VS Code has its own task runner Integrate w/ 3rd party tools: Babel Webpack etc. isBuildCommand property ties to Shift + Ctrl + B gesture isTestCommand property ties to Shift + Ctrl + T gesture 23
- 24.
- 25. let demo =+ ; Demo Running Custom Webpack Build Task 25
- 26. Node.js Debugging launch.json Defaultlaunch configuration provided: 26
- 27. Node.js Debugging (cont.) 3 easy steps: 1. Configure launch.json for Node.js debugging 2. Launch Node.js program: node --debug-brk program.js 3. Attach VS Code debugger to running program --debug and --debug-brk supported --debug-brk stops on 1st line of program 27
- 28. let demo =+ ; Demo Debugging Mocha Unit Tests: Attach to Node Process 28
- 29. Resources Best ofVS Code: Tips and Tricks Build 2016 session VS Code Docs VS Code Source on GitHub Visual Studio Code John Papa, Pluralsight course VS Code ES6 Sample Project 29
- 30. Thank you! ScanQR for slides: 30 GitHub.com/scottaddie/slide-decks ScottAddie.com @Scott_Addie LinkedIn.com/in/scottaddie