Visual Studio Code 1.68 includes enhancements to display language settings Ability to sponsor an extension to support developers and more

Visual Studio Code 1.68 includes enhancements to display language settings Ability to sponsor an extension to support developers and more

Work table

Control improvements Set the display language

The order Set the display language has been updated to include:

  • The name of the language in that language.
  • An available languages ​​section shows which languages ​​are not installed on your machine and if you select one it will be installed and applied automatically.

View the problem panel table

At this stage, Microsoft added a new feature that allows users to change the display of the Problems panel between a tree and a table. Compared to the tree structure, the table shows the source (language service or extension) of each problem, which allows users to filter the problems by their source.

You can change the UI display with the View as Table / View as Tree button at the top right of the Problems panel, or change the default display mode with the default screen Problems: Problem Mode.

Obsolete extensions

In this step, Microsoft added support for obsolete extensions to VS Code. An extension may simply become obsolete or obsolete in favor of another extension or when its functionality is integrated into VS Code. VS Code will stop using extensions in the Extensions view, as shown below.

An obsolete extension that is no longer maintained.

An obsolete extension in favor of another extension. In this case, VS Code does not allow users to install this extension.

An obsolete extension with its integrated VS Code functionality that can be activated by configuring the configuration.

VS Code will not automatically migrate or uninstall an obsolete extension. There will be a Migrate button to guide you to change the recommended extension.

Reference extensions

VS Code now allows users to sponsor their preferred extensions. When an extension can be sponsored, VS Code will display a sponsor button on the Extensions View Details page below:

The Sponsor button will direct you to the extension’s reference URL, where you can give your support.

Hide files in browser .gitignore

File Explorer now supports scanning and hiding files deleted by your file .gitignore. This can be enabled using the setting Explorer: Exclude Git Ignore (explorer.excludeGitIgnore). This parameter works with files.exclude to hide junk browser files.

Locks the float position

Some custom changes are difficult or impossible to activate with the mouse due to the presence of other elements of the user interface (for example, a scroll bar). Holding down the Alt key while the cursor is active will now “lock” it, giving it a wider edge and preventing the mouse movement from hiding it from hiding it. This is primarily an accessibility feature to make rollovers work well with screen magnifiers, but it is also useful for copying text from rollovers. Please note that this feature only applies outside of the editor, as editor changes can still be enabled unless otherwise specified by the editor.hover.sticky.

Parameter Editor Enhancements

The Parameter Editor now displays a default override indicator for language-specific settings. You can display language-specific settings by adding a language filter to the search bar in the settings editor, or by typing it explicitly (@lang: javascript), or by clicking the filter button to the right of the search bar and selecting the language option.

When the default override indicator is displayed, indicates that the default value for the language-specific setting has been overridden by an extension. The indicator also indicates which extension has replaced the default.

This iteration also corrects behavior where some configuration editor links are not redirected correctly when there was already a search query in the configuration editor’s search bar. The links now also have a suitable style to make it clearer when you hover over them.

Terminal

Find the matching background color

Next to the terminal, the previous version was implemented to show an edge around all matches, but this was a temporary solution until the support was implemented to dynamically change the background of the cells. A colored background is now the default for topics when matches are highlighted, and the overall experience should be similar to that of the editor.

Improvements in contrast and minimal contrast ratio

The background work of the match finder has added much more flexibility in how the terminal works with the background and foreground colors. For this reason, improvements have been made around the contrast in the terminal, aligning the images of the terminal closer to the editor. In addition, there is now the minimum contrast ratio feature that dynamically changes the foreground of the text to improve visibility.

  • Now the luminance will go the other way if the contrast is not achieved. For example, if no contrast is achieved for dark gray text on a lighter gray background with pure black (# _000000), the color will also try to move to white and the value that best fits the ratio will be used. desired contrast.
  • The selection is now drawn below the text when GPU acceleration is off and supports opaque colors. Previously, this had to be partially transparent and would erase the foreground color. With this change, the selection color now uses the same color as in the editor.
  • Nerd font symbols should now apply a minimal contrast ratio to match the neighboring text, while power line symbols and boxed characters will not apply a minimum contrast ratio because they are often adjacent to inverted cells without any highlighted characters.
  • Themes can now specify a fixed selection foreground color that will be used by default in high contrast themes.
  • Fixed several bugs to make the resulting foreground color more accurate.

Languages

TypeScript 4.7

VS Code is now compatible with TypeScript 4.7.3. This main TypeScript provides new language features, including enhanced control flow analysis and support for ECMAScript module support in Node.js. It also includes new tool features and fixes a number of major bugs.

Go to source definition

One of VS Code’s oldest and most voted feature requests is for VS Code to navigate to JavaScript implementations of features and external library symbols. Currently Go to the definition gives access to the type definition file (the .d.ts file) that defines the target function or symbol types. This is useful if you need to inspect the types or documentation of these symbols, but hides the actual implementation of the code. Current behavior also confuses many JavaScript users who may not understand the TypeScript type of .d.ts.

Although it changes Go to the definition Accessing the JavaScript implementation of a symbol may seem easy, there is a reason why this feature request has been open for so long. JavaScript (and in particular the compiled JavaScript that many libraries offer) is much harder to parse than a .d.ts. Trying to parse all JavaScript code under node_modules would be slow and also drastically increase memory usage. There are also many JavaScript patterns that the VS Code IntelliSense engine cannot understand.

This is where the new order comes in. Go to source definition. When you run this command from the context menu of the editor or command palette, TypeScript will try to find and access the JavaScript implementation of the symbol. It may take a few seconds and we may not always get the right result, but it should be useful in many cases.

Orderly Organize imports

The Organize Imports command for JavaScript and TypeScript allows you to quickly clear your import list. When run, it deletes unused imports and also sorts them alphabetically.

However, some code bases like to have some degree of manual control over how their imports are organized. One of the most common examples is the grouping of external versus internal imports:

1
2
3
4
5
6
7
8
9
10
11

// local code
import * as bbb from './bbb';
import * as ccc from './ccc';
import * as aaa from './aaa';
 
// built-ins
import * as path from 'path';
import * as child_process from 'child_process';
import * as fs from 'fs';
 
// some code...

In previous versions of VS Code, runningOrganize imports here is the following:

1
2
3
4
5
6
7
8
9
10

// local code
import * as child_process from 'child_process';
import * as fs from 'fs';
// built-ins
import * as path from 'path';
import * as aaa from './aaa';
import * as bbb from './bbb';
import * as ccc from './ccc';
 
// some code...

This is because all imports are sorted alphabetically and VS Code even tries to keep comments and new lines while doing so.

However, with TypeScript 4.7, Organizing Imports now supports groups. Running it in the above code is a bit more like what you would expect:

1
2
3
4
5
6
7
8
9
10
11

// local code
import * as aaa from './aaa';
import * as bbb from './bbb';
import * as ccc from './ccc';
 
// built-ins
import * as child_process from 'child_process';
import * as fs from 'fs';
import * as path from 'path';
 
// some code...

Source: Microsoft

Leave a Comment

Your email address will not be published.