rogerxu / rogerxu.github.io

Roger Xu's Blog
2 stars 2 forks source link

Visual Studio Code - 50+ #263

Open rogerxu opened 2 years ago

rogerxu commented 2 years ago

Release version 1.50

Visual Studio Code September 2020

Accessible settings editor

Interact with the settings list like any other list in VS Code.

Pinned tabs improvements

Resize pinned tabs, unpin with one click, and more.

A new setting workbench.editor.pinnedTabSizing allows you to configure how large a pinned tab should appear:

Linux ARM builds

VS Code is now available for both Linux ARMv7 and ARM64.

Trigger IntelliSense

For years, Ctrl+Space has been the predominant keybinding to trigger IntelliSense. However, on macOS and Windows, the same keybinding is used to toggle between keyboard layouts. To minimize confusion, we added another keybinding to trigger IntelliSense: on Windows and Linux it's Ctrl+I, and on macOS it's Cmd+I.

Improved debugging experience

Language hover now available while debugging

Auto sizing debug hover

The Debug Console now supports filtering, making it easier for users to find the output they are looking for, or to hide irrelevant logging output. We've added a badge to make it clear how many items are filtered away.

New JS debugger features

Toggle auto attach flows and see performance in real-time.

Panel layout improvements

New panel maximization settings and bottom panel size.

Webview Views support

Build extensions with webview views in the sidebar and panel.

Updated "Create a Dev Container" tutorial

Get started with Development Containers.

rogerxu commented 2 years ago

Release version 1.51

Visual Studio Code October 2020

More prominent pinned tabs

Pinned tabs will now always show their pin icon, even while inactive, to make them easier to identify. If an editor is both pinned and contains unsaved changes, the icon reflects both states.

image

Local Echo

Making modifications in the terminal traditionally requires information to be sent to the terminal process, processed, and returned to VS Code in order to be affected.

This release adds a "local echo" mode to the terminal, which attempts to predict modifications and cursor movements made locally and show them in the UI without requiring a round trip to the server. By default, predicted characters show as "dimmed".

Source Control input box saves commit message history

Press and to display the prior and next commits, respectively.

rogerxu commented 2 years ago

Release version 1.52

Visual Studio Code November 2020

Word wrap in diff editor

Both inline and side-by-side views now support word wrapping.

image

New extension bisect feature

Troubleshoot which extensions are causing issues in VS Code.

You can start extension bisect via the Help > Start Extension Bisect command. It then guides you through the process of repeatedly disabling and re-enabling extensions. After each reload, you will be prompted to confirm if the issue is still there.

image

image

Keyboard shortcuts editor improvements

Create a keybinding from the Command Palette.

You can now configure a keybinding for a command from the Command Palette, via the Configure Keybinding gear button on the right.

Undo file operations in Explorer

Undo or redo file operations in the Explorer.

New Git commands and settings

Optimize your Version Control experience with new capabilities.

New commands

New settings

Preview editor improvements

Turn off preview editors altogether, and try new interaction models.

Sticky tab stops for spaces

Improved experience when indenting with spaces.

Improved word-based suggestions

Display word-based suggestions from other open files.

Use the editor.wordBasedSuggestionsMode setting with allDocuments to suggest words from all open files, use matchingDocuments to suggest words from open files of the same language (default), and use currentDocument to only suggest words from the current file.

Terminal configuration support

Modify terminal settings from the terminal dropdown menu.

Debugging: Conditions for exception breakpoints

VS Code now supports editing conditions for Exception breakpoints from the Breakpoints view using the Edit Condition context menu action.

rogerxu commented 2 years ago

Release version 1.53

Visual Studio Code January 2021

Wrap tabs

Wrap editor tabs in the workbench instead of having a scrollbar.

workbench.editor.wrapTabs

Configure tab decorations

Add editor tab status decorations.

Use workbench.editor.decorations.colors to decorate tabs with colors, like red/green for files with errors and warnings.

Use workbench.editor.decorations.badges to decorate tabs with badges, like M for git modified.

Customize search mode

Use the Search view or open a new Search editor.

search.mode

JavaScript debugging

Support for conditional exception breakpoints and Node.js worker_threads.

Notebook UX updates

Outline view for Notebook cells, and breadcrumbs for improved navigation.

Markdown preview image auto update

Preview automatically updates when images change.

Emmet improvements

Faster performance and supporting the latest features.

Extension guidelines

Documented best practices for extension authors.

Remote Development video series

Learn to create and configure container-based environments.

rogerxu commented 2 years ago

Release version 1.54

Visual Studio Code February 2021

Apple Silicon builds

VS Code is now available in stable for Apple Silicon.

Accessibility improvements

Better word navigation on Windows and roles for views and buttons.

Persistent terminal processes

Local terminal processes are restored on window reload.

Product Icon Themes

Personalize your VS Code icon imagery with Product Icon Themes.

Timeline view improvements

Compare changes across Git history timeline entries.

image

Auto reload Notebooks

Notebooks automatically reload when their file changes on disk.

Remote ports table view

Remote ports now shown in a table widget.

image

JS Doc templates now generate @returns

/**
 *
 * @param {*} el
 * @returns
 */
function getViz(el) {
  return el?.viz;
}

Brackets extensions

Use Brackets keyboard shortcuts in VS Code.

Troubleshooting extensions blog post

Learn to troubleshoot extensions using extension bisect.

Visual Studio Code extension bisect utility

rogerxu commented 2 years ago

Release version 1.55

Visual Studio Code March 2021

Accessibility improvements

Multi-cursor support and increased line limit.

Updated icons for macOS Big Sur

Brand icons that match the visual style of Big Sur.

New auto closing pair deletion

The behavior of pressing Backspace has changed when inside auto-closing pairs. The editor will now delete the matching closing bracket or matching closing quote only if the editor auto-inserted that character. This behavior is controlled via a newly introduced setting called editor.autoClosingDelete, which can be configured to "always" to get the previous behavior.

Improvements to breakpoints

Inline menu to edit conditions and hit count

image

Support for all access types of data breakpoints

image

Editor status decorations

Editor tab status decorations are on by default.

image

Customize keyboard shortcuts editor

Resize columns in the keyboard shortcuts editor.

Improved remote ports management

Port forwarding auto detection, regex naming, and more.

Terminal profiles

Define profiles in terminal to conveniently launch non-default shells.

image

Notebook improvements

Multiple cell selection, and more customizable diff editor.

VS Code on Raspberry Pi

New topic explaining how to install VS Code on Raspberry Pi devices.

rogerxu commented 2 years ago

Release version 1.56

Visual Studio Code April 2021

Improved hover feedback

Helps you quickly find clickable editor actions.

Terminal profile improvements

Create a custom default terminal profile.

{
  "terminal.integrated.defaultProfile.windows": "Cmder",
  "terminal.integrated.profiles.windows": {
    "PowerShell": {
      "source": "PowerShell",
      "icon": "terminal-powershell"
    },
    "Command Prompt": {
      "path": [
        "${env:windir}\\Sysnative\\cmd.exe",
        "${env:windir}\\System32\\cmd.exe"
      ],
      "args": [],
      "icon": "terminal-cmd"
    },
    "Git Bash": {
      "source": "Git Bash"
    },
    "Cmder": {
      "path": [
        "${env:windir}\\Sysnative\\cmd.exe",
        "${env:windir}\\System32\\cmd.exe"
      ],
      "args": ["/K", "%CMDER_ROOT%/vendor/bin/vscode_init.cmd"],
      "icon": "terminal-cmd"
    }
  }
}

New terminal picker

Profiles and setting shortcuts have moved out of the dropdown and into a new + button with a dropdown.

When selected, the dropdown button displays a menu

Debugger inline values

Display variable values inline during debugging sessions.

Java extension displaying inline values in the editor while debugging

Notebook KaTeX support

Math support in notebook Markdown cells.

Markdown preview typographer support

The new markdown.preview.typographer setting lets you enabled smart quotes and simple typographic replacements in the built-in Markdown preview.

Smart quotes and text replacement in the Markdown preview

Remote - Containers volumes view

Manage mounted volumes within Docker containers.

winget installation

VS Code is available via the Windows Package Manager.

New introductory videos

Videos for getting started with VS Code as well as working with C++.

https://code.visualstudio.com/docs/getstarted/introvideos

Terminal tabs preview

Get a first look at managing open terminals with the new tabs view.

"terminal.integrated.tabs.enabled": true

The tabs view is a split pane to the right of two split terminals. It contains icons and labels for each terminal instance.

rogerxu commented 2 years ago

Release version 1.57

Visual Studio Code May 2021

Workspace Trust

Extra security against code execution when browsing unfamiliar source code.

Trust this folder dialog

New Getting Started experience

Helps you quickly set up and learn about VS Code.

Remote Repositories

Browse and edit code without locally cloning repositories.

Suggestion preview

With the new setting editor.suggest.preview enabled, a preview of the selected suggestion or snippet is shown at the cursor position.

Terminal tabs

Tabs let you easily create, manage, and group multiple open terminals.

Single inlined terminal tab, terminal tabs with status, and collapsed terminal tabs

Edge browser debugging

Integrates the Microsoft Edge Developer Tools directly into VS Code.

Debugger inspect button

JSDoc @link support

Add @link tags in your comments for fast symbol navigation.

JSDoc @link tags are written as: {@link symbolName}. You can also optionally specify text to be render in place of the symbol name: {@link class.property Alt text}.

Completions in import statements

Auto import in JavaScript and TypeScript automatically add imports when you accept a suggestion.

Go to Definition for non-code files

Quickly jump to images and stylesheets.

rogerxu commented 2 years ago

Release version 1.58

Visual Studio Code June 2021

Terminals in the editor

Create or move terminals into the editor area.

4 terminals in the editor area are laid out in a 2 by 2 grid

Workspace Trust

Quickly customize Workspace Trust settings, disable Restricted Mode banner.

Editor scroll bar customization

Set bar visibility and width, click navigation behavior.

Markdown preview KaTeX support

Math support in the Markdown preview.

Math rendering in the built-in Markdown preview

Settings editor improvements

Support for multiple checkboxes and enumeration dropdowns.

Sticky debug environment choice

Debugger remembers your previous environment choice.

Live Preview extension

We have developed a Live Preview extension, which hosts a local server for web development previewing!

It features an in-editor browser preview, live preview refreshing (on file change or on save), multi-root support, and more!

The extension also has a Live Preview task, which runs a persistent server and allows you to view server traffic and its associated files.

'Open in VS Code' badge

Lets visitors quickly open your GitHub repo in VS Code.

Screenshot of the microsoft/vscode repo on GitHub with the added "Open in VS Code" badge in the README

To show the badge on your repo, add this Markdown snippet to the README.md file (replace organization/repository with the values for your project):

[![Open in Visual Studio Code](https://open.vscode.dev/badges/open-in-vscode.svg)](https://open.vscode.dev/organization/repository)
rogerxu commented 2 years ago

Release version 1.59

Visual Studio Code July 2021

Extension view improvements

Rich extension detail hovers, new runtime status tab.

The Extensions view now shows a custom hover on an extension. This rich hover includes the complete description of the extension and other useful information such as why an extension is disabled or recommended.

Custom Extension hover

You can now check the runtime status of an extension in the new Runtime Status tab in the extension pane. Status information includes its activation time, whether it is activated on startup, and if it has any warnings or errors.

Extension Runtime Status

The Extension pane Details tab now shows categories, resources links, and other information such as the extension release and update dates. Selecting a category will display other extensions in that category in the Extensions view.

Extension Details

Settings editor validation

Quickly find editing errors for object-based settings.

The Settings editor now supports validation on objects. The validation checks for type errors that can be introduced when editing the JSON file directly.

Object setting showing validation errors

Array settings now have drag and drop support in non-editing mode. Moreover, enum array settings with the property uniqueItems set to true now only show remaining options rather than all options in the dropdowns.

The Settings editor also now supports multiline string settings, where the value is rendered in a multiline text area instead of a single-line input box:

An example of a multiline string setting

Drag and drop terminals

Move terminals across windows to both editor and panel areas.

Underline and strikethrough support

The integrated terminal now supports underline and strikethrough attributes. For example, Git can be configured to use these new attributes in .gitconfig:

[color "status"]
  added = green bold
  changed = red bold strike
  untracked = cyan
  branch = yellow black bold ul

Git output in terminal with underline and strikethrough text

Built-in support for Jupyter notebooks

Open .ipynb files directly in VS Code.

Testing API finalized

Native support for running tests in VS Code with built-in Test Explorer.

These APIs provide greater flexibility, better performance, and richer UX over what has been found previously in extensions.

Image showing the test explorer and rich diff view experience

Existing users of the Test Explorer UI extension can get the native experience by setting testExplorer.useNativeTesting to true.

Debug Disassembly view preview

Display disassembled C++ code in VS Code.