Issue #4  (JSON Settings vs. Settings UI)05/18/22

Advertisement
Get a weekly dose of tools, articles, and other resources covering remote work, productivity, career well-being, and lots more.

Way back in August of 2018 with the release of version 1.27, VS Code updated its settings editor to use a GUI to allow you to modify its core settings. If you've been using VS Code for only a short time, then you probably only know the GUI.

However, if you prefer a text-based UI for changing your settings, you can switch back to the old JSON settings view. To do this, open the command palette (CTRL/CMD-SHIFT-P) then type "Open Settings". Choose the option "Open Settings (UI)".

This opens your editor's settings UI (as mentioned, now the default). In the "Search settings" box type "settings" and this will filter the option "Workbench - Settings: Editor" to the top.

Switch from GUI settings to JSON in VS Code

In that UI dialog you can select to switch the default settings UI to use JSON instead of the GUI. You can also type "Use split JSON" in the search settings UI, and check the option "Use Split JSON".

Once those options are set, you can use the usual shortcut to open your settings (CTRL/CMD+comma) and you'll see the JSON settings file in split view with your default user settings on the left and your user settings on the right.
 
VS Code Settings JSON split view

You can still access the GUI version of the settings via the command palette or by clicking the small "Open Settings (UI)" icon in the top right area, which I've indicated in the image above.

Now on to this week's hand-picked links!
 

VS Code Tools

Quokka — A popular extension for VS Code, IntelliJ, Atom, and Sublime, that helps you debug your JavaScript via instant feedback next to your code as you type.

Preview.js — A VS Code, IntelliJ, and CLI tool that lets you preview UI components in your IDE instantly. Compatible with React 16+, SolidJS, and Vue 2 and 3.

Ionic — VS Code extension for mobile development in Ionic and Capacitor.

Visual Studio Code for Python Programmers — Note exactly a tool but a book published by SitePoint that might be of interest to those of you working with Python.

VS Code Articles

VS Code Updates (April 2022) — The latest updates to VS Code including explorer file nesting, bracket pair colorization enabled by default, Rust and Java features, and lots more.

Cherry-Pick Your Teammate's Changes Without Push 'n Pull-ing To Your Repo In VS Code — A quick tip from Agnieszka Stec that makes it easier to share code among team members.

A launch.json Setting for End-to-end Web Development — Some tips from Christian Heilmann who works on browser tools for Microsoft on how to maximize your workflow without ever leaving VS Code.

Node.js Notebooks — VS Code extension that provides iterative and interactive programming for Node.js in JavaScript/TypeScript (REPL), with great support for Tensorflow.js, debugging, and more.

Bytes — A JavaScript newsletter that's entertaining and informative with lots of coding tidbits, news, and tools.   Sponsor 

The Alternatives

Kakoune — A text editor that attempts to improve on the apparent weaknesses of other editors via a modal design that requires fewer keystrokes.

dprint — A pluggable and configurable code formatting platform written in Rust.

Why I’ve Spent My Easter Break Customizing Neovim — A good post if you're new to Vim and maybe don't know the differences between Vim and Neovim.

CodeSandbox for iOS — A full-fledged development environment that brings the power of modern JavaScript development to your iOS device.


Suggestions?

If you have any link suggestions, including a tool, article, or other resources related to VS Code or another IDE, send it via DM on X: @LouisLazaris or just hit reply on this email.

That's it for this issue.

Happy VS Coding!
Louis
VSCode.Email
@LouisLazaris
Copyright © VSCode.Email. All rights reserved.

Not affiliated with Microsoft, Visual Studio Code, or any of its trademarks.