Merge branch 'main' into vnext
This commit is contained in:
gregvanl
Коммит
62f70cb109
|
|
@ -25,7 +25,7 @@ The following table shows which extension hosts are available in the various con
|
|||
--- | --- | --- | ---
|
||||
| VS Code on the desktop | x | x | |
|
||||
| [VS Code with remote](/docs/remote/remote-overview) (Container, SSH, WSL, GitHub Codespace) | x | x | x |
|
||||
| VS Code for the Web (github.dev) | | x | |
|
||||
| VS Code for the Web (vscode.dev, github.dev) | | x | |
|
||||
| VS Code for the Web with Codespaces | | x | x |
|
||||
|
||||
### Extension Host runtimes
|
||||
|
|
|
|||
|
|
@ -265,9 +265,9 @@ export function activate(context: vscode.ExtensionContext) {
|
|||
|
||||
### Opening something in a local browser or application
|
||||
|
||||
Spawning a process or using a module like `opn` to launch a browser or other application for particular URI can work well for local scenarios, but Workspace Extensions run remotely, which can cause the application to launch on the wrong side. VS Code Remote Development **partially** shims the `opn` node module to allow existing extensions to function. You can call the module with a URI and VS Code will cause the default application for the URI to appear on the client side. However, this is not a complete implementation, as options are not support and a `child_process` object is not returned.
|
||||
Spawning a process or using a module like `opn` to launch a browser or other application for particular URI can work well for local scenarios, but Workspace Extensions run remotely, which can cause the application to launch on the wrong side. VS Code Remote Development **partially** shims the `opn` node module to allow existing extensions to function. You can call the module with a URI and VS Code will cause the default application for the URI to appear on the client side. However, this is not a complete implementation, as options are not supported and a `child_process` object is not returned.
|
||||
|
||||
Instead of relying on a third-party node module, we recommend extensions take advantage of the `vscode.env.openExternal` method to launch the default registered application on your local operating system for given URI. Even better, `vscode.env.openExternal` **does automatic localhost port forwarding!** You can use it to point to a local web server on a remote machine or codespace and serve up content even if that port is blocked externally.
|
||||
Instead of relying on a third-party node module, we recommend that extensions take advantage of the `vscode.env.openExternal` method to launch the default registered application on your local operating system for given URI. Even better, `vscode.env.openExternal` **does automatic localhost port forwarding!** You can use it to point to a local web server on a remote machine or codespace and serve up content even if that port is blocked externally.
|
||||
|
||||
> **Note:** Currently the forwarding mechanism in the Codespaces browser-based editor only supports **http and https requests**. However, you can interact with any TCP connection when connecting to a codespace from VS Code.
|
||||
|
||||
|
|
@ -364,7 +364,7 @@ export async function activate(context: vscode.ExtensionContext) {
|
|||
|
||||
When running this sample in VS Code, it wires up a `vscode://` or `vscode-insiders://` URI that can be used as a callback for an authentication provider. When running in the Codespaces browser-based editor, it wires up a `https://*.github.dev` URI without any code changes or special conditions.
|
||||
|
||||
While OAuth is outside the scope of this document, note that if you adapted this sample to a real authentication provider, you may need to build a proxy service in front of the provider. This is because not all providers allow `vscode://` callback URIs and others do not allow wildcard host names for callbacks over HTTPS. We also recommend using an [OAuth 2.0 Authorization Code with PKCE flow](https://oauth.net/2/pkce/) wherever possible (e.g Azure AD supports PKCE) to improve the security of the callback.
|
||||
While OAuth is outside the scope of this document, note that if you adapted this sample to a real authentication provider, you may need to build a proxy service in front of the provider. This is because not all providers allow `vscode://` callback URIs and others do not allow wildcard host names for callbacks over HTTPS. We also recommend using an [OAuth 2.0 Authorization Code with PKCE flow](https://oauth.net/2/pkce/) wherever possible (e.g. Azure AD supports PKCE) to improve the security of the callback.
|
||||
|
||||
### Varying behaviors when running remotely or in the Codespaces browser editor
|
||||
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ You can use the following pattern:
|
|||
|
||||
```TypeScript
|
||||
// on activate
|
||||
const versionKey = context.extension.id + '.version';
|
||||
const versionKey = 'shown.version';
|
||||
context.globalState.setKeysForSync([versionKey]);
|
||||
|
||||
// later on show page
|
||||
|
|
@ -62,7 +62,7 @@ const lastVersionShown = context.globalState.get(versionKey);
|
|||
if (!isHigher(currentVersion, lastVersionShown)) {
|
||||
return;
|
||||
}
|
||||
context.globalState.set(versionKey, currentVersion);
|
||||
context.globalState.update(versionKey, currentVersion);
|
||||
// show page
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -1,12 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Extending Core Functionalities
|
||||
|
||||
Talk about the core functionalities that extension could plug-in their providers for:
|
||||
|
||||
- File System Provider
|
||||
- Search Provider
|
||||
- SCM Provider
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# File System Provider
|
||||
|
||||
For https://github.com/microsoft/vscode-extension-samples/tree/main/fsprovider-sample and https://github.com/microsoft/vscode-extension-samples/tree/main/nodefs-provider-sample
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Internationalization
|
||||
|
||||
https://github.com/microsoft/vscode-extension-samples/tree/main/i18n-sample
|
||||
|
|
@ -1,3 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:ac95021ec1051c9344c1f558220bd9d8d540720b2fc42da2bd7b96a52321e959
|
||||
size 31633
|
||||
oid sha256:5c1beff992d8279c3a944be794feff420963c9807068f8f4bb2bd00d5d1b7e33
|
||||
size 62944
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:0b20531e0f7da104f7be688f0909b34df3d60d646599cc160738b0f226b3f6d2
|
||||
size 174753
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Search Provider
|
||||
|
||||
Sample to be written.
|
||||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Terminal Guide
|
||||
|
||||
https://github.com/microsoft/vscode-extension-samples/tree/main/terminal-sample
|
||||
|
|
@ -122,7 +122,7 @@ async function discoverAllFilesInWorkspace() {
|
|||
// When files change, re-parse them. Note that you could optimize this so
|
||||
// that you only re-parse children that have been resolved in the past.
|
||||
watcher.onDidChange(uri => parseTestsInFileContents(getOrCreateFile(uri)));
|
||||
// And, finally, delete TestItems fro removed files. This is simple, since
|
||||
// And, finally, delete TestItems for removed files. This is simple, since
|
||||
// we use the URI as the TestItem's ID.
|
||||
watcher.onDidDelete(uri => controller.items.delete(uri.toString()));
|
||||
|
||||
|
|
@ -185,7 +185,7 @@ const debugProfile = controller.createRunProfile('Debug', vscode.TestRunProfileK
|
|||
The `runHandler` should call `controller.createTestRun` at least once, passing through the original request. The request contains the tests to `include` in the test run (which is omitted if the user asked to run all tests) and possibly tests to `exclude` from the run. The extension should use the resulting `TestRun` object to update the state of tests involved in the run. For example:
|
||||
|
||||
```ts
|
||||
async function runHandler(request: vscode.TestRunRequest, token: vscode.CancellationToken) {
|
||||
async function runHandler(shouldDebug: boolean, request: vscode.TestRunRequest, token: vscode.CancellationToken) {
|
||||
const run = controller.createTestRun(request);
|
||||
const queue: vscode.TestItem[] = [];
|
||||
|
||||
|
|
@ -239,7 +239,13 @@ In addition to the `runHandler`, you can set a `configureHandler` on the `TestRu
|
|||
|
||||
> VS Code intentionally handles test configuration differently than debug or task configuration. These are traditionally editor or IDE-centric features, and are configured in special files in the `.vscode` folder. However, tests have traditionally been executed from the command line, and most test frameworks have existing configuration strategies. Therefore, in VS Code, we avoid duplication of configuration and instead leave it up to extensions to handle.
|
||||
|
||||
#### Test Tags
|
||||
### Test Output
|
||||
|
||||
In addition to the messages passed to `TestRun.failed` or `TestRun.errored`, you can append generic output using `run.appendOutput(str)`. This output can be displayed in a terminal using the **Test: Show Output** and through various buttons in the UI, such as the terminal icon in the Test Explorer view.
|
||||
|
||||
Because the string is rendered in a terminal, you can use the full set of [ANSI codes](https://en.wikipedia.org/wiki/ANSI_escape_code), including the styles available in the [ansi-styles](https://www.npmjs.com/package/ansi-styles) npm package. Bear in mind that, because it is in a terminal, lines must be wrapped using CRLF (`\r\n`), not just LF (`\n`), which may be the default output from some tools.
|
||||
|
||||
### Test Tags
|
||||
|
||||
Sometime tests can only be run under certain configurations, or not at all. For these use cases, you can use Test Tags. `TestRunProfile`s can optionally have a tag associated with them and, if they do, only tests that have that tag can be run under the profile. Once again, if there is no eligible profile to run, debug, or gather coverage from a specific test, those options will not be shown in the UI.
|
||||
|
||||
|
|
@ -307,4 +313,4 @@ The `testing/item/context` [menu contribution point](/api/references/contributio
|
|||
|
||||
Additional [context keys](/api/references/when-clause-contexts) are available in the `when` clauses of your menu items: `testId`, `controllerId`, and `testItemHasUri`. For more complex `when` scenarios, where you want actions to be optionally available for different Test Items, consider using the [`in` conditional operator](/api/references/when-clause-contexts#in-conditional-operator).
|
||||
|
||||
If want to reveal a test in the explorer, you can pass the test to the command `vscode.commands.executeCommand('vscode.revealTestInExplorer', testItem)`.
|
||||
If you want to reveal a test in the Explorer, you can pass the test to the command `vscode.commands.executeCommand('vscode.revealTestInExplorer', testItem)`.
|
||||
|
|
|
|||
|
|
@ -19,7 +19,7 @@ Not all extensions are able to work with virtual resources and may require resou
|
|||
|
||||
In general, users want as many extensions as possible to work in virtual workspaces and to have a good user experience when browsing and editing remote resources. This guide shows how extensions can test against virtual workspaces, describes modifications to allow them to work in virtual workspaces, and introduces the `virtualWorkspaces` capability property.
|
||||
|
||||
Modifying an extension to work with virtual workspaces is also an important step for working well in VS Code for the Web. VS Code for the Web runs entirely inside a browser and workspaces are virtual due to the browser sandbox. See the [Web Extensions](/api/extension-guides/web-extensions) guide for more details.
|
||||
Modifying an extension to work with virtual workspaces is also an important step for working well in [VS Code for the Web](/docs/editor/vscode-web). VS Code for the Web runs entirely inside a browser and workspaces are virtual due to the browser sandbox. See the [Web Extensions](/api/extension-guides/web-extensions) guide for more details.
|
||||
|
||||
## Is my extension affected?
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ Visual Studio Code can run as an editor in the browser. One example is the `gith
|
|||
|
||||
Web extensions share the same structure as regular extensions, but given the different runtime, don't run with the same code as extensions written for a Node.js runtime. Web extensions still have access to the full VS Code API, but no longer to the Node.js APIs and module loading. Instead, web extensions are restricted by the browser sandbox and therefore have [limitations](#web-extension-main-file) compared to normal extensions.
|
||||
|
||||
The web extension runtime is supported on VS Code desktop too. If you decide to create your extension as a web extension, it will be supported on VS Code for the Web (including `github.dev`) as well as on the desktop and in services like [GitHub Codespaces](/docs/remote/codespaces).
|
||||
The web extension runtime is supported on VS Code desktop too. If you decide to create your extension as a web extension, it will be supported on [VS Code for the Web](/docs/editor/vscode-web) (including `vscode.dev` and `github.dev`) as well as on the desktop and in services like [GitHub Codespaces](/docs/remote/codespaces).
|
||||
|
||||
## Web extension anatomy
|
||||
|
||||
|
|
@ -68,7 +68,7 @@ Extensions that have only a `main` entry point, but no `browser` are not web ext
|
|||
|
||||
|
||||
|
||||
Extensions with only declarative contributions (only `contributes`, no `main` or `browser`) can be web extensions. They can be installed and run in VS Code for the Web without any modifications by the extension author. Examples of extensions with declarative contributions include themes, grammars, and snippets.
|
||||
Extensions with only declarative contributions (only `contributes`, no `main` or `browser`) can be web extensions. They can be installed and run in [VS Code for the Web](/docs/editor/vscode-web) without any modifications by the extension author. Examples of extensions with declarative contributions include themes, grammars, and snippets.
|
||||
|
||||
Extensions can have both `browser` and `main` entry points in order to run in browser and in Node.js runtimes. The [Update existing extensions to Web extensions](#update-existing-extensions-to-web-extensions) section shows how to migrate an extension to work in both runtimes.
|
||||
|
||||
|
|
@ -190,11 +190,11 @@ Some important fields of `webpack.config.js` are:
|
|||
|
||||
## Test your web extension
|
||||
|
||||
There are three ways to test a web extension before publishing it to the Marketplace.
|
||||
There are currently three ways to test a web extension before publishing it to the Marketplace.
|
||||
|
||||
* Use VS Code running on the desktop with the `--extensionDevelopmentKind=web` option to run your web extension in a web extension host running in VS Code.
|
||||
* Use the [@vscode/test-web](https://github.com/microsoft/vscode-test-web) node module to open a browser containing VS Code for the Web including your extension, served from a local server.
|
||||
* Sideload your extension in a running VS Code Web instance.
|
||||
* Sideload your extension onto [vscode.dev](https://vscode.dev) to see your extension in the actual environment.
|
||||
|
||||
### Test your web extension in VS Code running on desktop
|
||||
|
||||
|
|
@ -290,13 +290,13 @@ Check the [@vscode/test-web README](https://www.npmjs.com/package/@vscode/test-w
|
|||
|
||||
The web bits of VS Code are downloaded to a folder `.vscode-test-web`. You want to add this to your `.gitignore` file.
|
||||
|
||||
### Sideloading your web extension in a running VS Code for the Web instance
|
||||
### Test your web extension in on vscode.dev
|
||||
|
||||
For this scenario, you need to make the bits of the extension accessible to the service that runs VS Code.
|
||||
Before you publish your extension for everyone to use on VS Code for the Web, you can verify how your extension behaves in the actual [vscode.dev](https://vscode.dev) environment.
|
||||
|
||||
Note: Sideloading is not supported on github.dev.
|
||||
To see your extension on vscode.dev, you first need to host it from your machine for vscode.dev to download and run.
|
||||
|
||||
From your extension's path, start an HTTP server by running `npx serve --cors`:
|
||||
From your extension's path, start an HTTP server by running `npx serve --cors -l 5000`:
|
||||
|
||||
```bash
|
||||
$ npx serve --cors -l 5000
|
||||
|
|
@ -312,19 +312,27 @@ npx: installed 78 in 2.196s
|
|||
│ Copied local address to clipboard! │
|
||||
│ │
|
||||
└───────────────────────────────────────────────────┘
|
||||
|
||||
```
|
||||
|
||||
Then, in another terminal:
|
||||
Then, in another terminal, run `npx localtunnel -p 5000`:
|
||||
|
||||
```bash
|
||||
$ npx localtunnel -p 5000
|
||||
npx: installed 22 in 1.048s
|
||||
your url is: https://dangerous-cat-40.loca.lt
|
||||
your url is: https://hungry-mole-48.loca.lt/
|
||||
|
||||
```
|
||||
|
||||
Click the link returned by `localtunnel` and accept the usage terms.
|
||||
**Important:** Now click on the generated URL (`https://hungry-mole-48.loca.lt/` in this case) and select **Click to Continue**.
|
||||
|
||||
Finally, in VS Code Web, run the command **Developer: Install Web Extension...** and paste the URL from above, for example, `https://dangerous-cat-40.loca.lt`.
|
||||
|
||||
|
||||
Finally, open [vscode.dev](https://vscode.dev), run **Developer: Install Web Extension...** from the Command Palette (`kb(workbench.action.showCommands)`) and paste the generated URL shown above, `https://hungry-mole-48.loca.lt/` in the example, and select **Install**.
|
||||
|
||||
You can check the logs in the console of the Developer Tools of your browser to see any errors, status, and logs from your extension.
|
||||
|
||||
You may see other logs from vscode.dev itself. In addition, you can't easily set breakpoints nor see the source code of your extension. These limitations make debugging in vscode.dev not the most pleasant experience so we recommend using the first two options for testing before sideloading onto vscode.dev. Sideloading is a good final sanity check before publishing your extension.
|
||||
|
||||
## Web extension tests
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Multiroot Support
|
||||
|
||||
https://github.com/microsoft/vscode/wiki/Extension-Authoring:-Adopting-Multi-Root-Workspace-APIs
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Smart Editing Guide
|
||||
|
||||
This page should:
|
||||
|
||||
- Point to a reference topic that lists every language feature that's available.
|
||||
- Illustrate a sample that uses `vscode.langauges.registerCompletionProvider` API and `vscode.languages.createDiagnosticCollection` API for completion and diagnostics
|
||||
|
|
@ -98,6 +98,9 @@ hand, shows disabled items but doesn't show the category label.
|
|||
|
||||
> **Note:** When a command is invoked (from a key binding, from the **Command Palette**, any other menu, or programmatically), VS Code will emit an activationEvent `onCommand:${command}`.
|
||||
|
||||
> **Note:** When using icons form [product icons](https://code.visualstudio.com/api/references/icons-in-labels#icon-listing), setting `light` and `dark` will disable the icon.
|
||||
> The correct syntax is `"icon": "$(book)"`
|
||||
|
||||
### command example
|
||||
|
||||
```json
|
||||
|
|
@ -711,6 +714,11 @@ Currently extension writers can contribute to:
|
|||
- The Timeline view item context menu - `timeline/item/context`
|
||||
- The Extensions view context menu - `extension/context`
|
||||
- The Test Explorer item context menu - `testing/item/context`
|
||||
- The notebook toolbar - `notebook/toolbar`
|
||||
- The notebook cell title menu bar - `notebook/cell/title`
|
||||
- The notebook cell execution menu - `notebook/cell/execute`
|
||||
- The interactive toolbar - `interactive/toolbar`
|
||||
- The interactive cell title menu bar - `interactive/cell/title`
|
||||
- Any [contributed submenu](/api/references/contribution-points#contributes.submenus)
|
||||
|
||||
> **Note:** When a command is invoked from a (context) menu, VS Code tries to infer the currently selected resource and passes that as a parameter when invoking the command. For instance, a menu item inside the Explorer is passed the URI of the selected resource and a menu item inside an editor is passed the URI of the document.
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ Every Visual Studio Code extension needs a manifest file `package.json` at the r
|
|||
| ------------------------------------------------------- | :------: | ------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| `name` | Y | `string` | The name of the extension - should be all lowercase with no spaces. |
|
||||
| `version` | Y | `string` | [SemVer](https://semver.org/) compatible version. |
|
||||
| `publisher` | Y | `string` | The [publisher name](/api/working-with-extensions/publishing-extension#publishers-and-personal-access-tokens) |
|
||||
| `publisher` | Y | `string` | The [publisher name](/api/working-with-extensions/publishing-extension#publishing-extensions) |
|
||||
| `engines` | Y | `object` | An object containing at least the `vscode` key matching the versions of VS Code that the extension is [compatible](/api/working-with-extensions/publishing-extension#visual-studio-code-compatibility) with. Cannot be `*`. For example: `^0.10.5` indicates compatibility with a minimum VS Code version of `0.10.5`. |
|
||||
| `license` | | `string` | Refer to [npm's documentation](https://docs.npmjs.com/files/package.json#license). If you do have a `LICENSE` file in the root of your extension, the value for `license` should be `"SEE LICENSE IN <filename>"`. |
|
||||
| `license` | | `string` | Refer to [npm's documentation](https://docs.npmjs.com/cli/v7/configuring-npm/package-json#license). If you do have a `LICENSE` file in the root of your extension, the value for `license` should be `"SEE LICENSE IN <filename>"`. |
|
||||
| `displayName` | | `string` | The display name for the extension used in the Marketplace. |
|
||||
| `description` | | `string` | A short description of what your extension is and does. |
|
||||
| `categories` | | `string[]` | The categories you want to use for the extensions. Allowed values: `[Programming Languages, Snippets, Linters, Themes, Debuggers, Formatters, Keymaps, SCM Providers, Other, Extension Packs, Language Packs, Data Science, Machine Learning, Visualization, Notebooks, Education]` |
|
||||
|
|
@ -33,15 +33,15 @@ Every Visual Studio Code extension needs a manifest file `package.json` at the r
|
|||
| `badges` | | `array` | Array of [approved](/api/references/extension-manifest#approved-badges) badges to display in the sidebar of the Marketplace's extension page. Each badge is an object containing 3 properties: `url` for the badge's image URL, `href` for the link users will follow when clicking the badge and `description`. |
|
||||
| `markdown` | | `string` | Controls the Markdown rendering engine used in the Marketplace. Either `github` (default) or `standard`. |
|
||||
| `qna` | | `marketplace` (default), `string`, `false` | Controls the **Q & A** link in the Marketplace. Set to `marketplace` to enable the default Marketplace Q & A site. Set to a string to provide the URL of a custom Q & A site. Set to `false` to disable Q & A altogether. |
|
||||
| `dependencies` | | `object` | Any runtime Node.js dependencies your extensions needs. Exactly the same as [npm's `dependencies`](https://docs.npmjs.com/files/package.json#dependencies). |
|
||||
| `devDependencies` | | `object` | Any development Node.js dependencies your extension needs. Exactly the same as [npm's `devDependencies`](https://docs.npmjs.com/files/package.json#devdependencies). |
|
||||
| `dependencies` | | `object` | Any runtime Node.js dependencies your extensions needs. Exactly the same as [npm's `dependencies`](https://docs.npmjs.com/cli/v7/configuring-npm/package-json#dependencies). |
|
||||
| `devDependencies` | | `object` | Any development Node.js dependencies your extension needs. Exactly the same as [npm's `devDependencies`](https://docs.npmjs.com/cli/v7/configuring-npm/package-json#devdependencies). |
|
||||
| `extensionPack` | | `array` | An array with the ids of extensions bundled with this extension. These other extensions will be installed when the primary extension is installed. The id of an extension is always `${publisher}.${name}`. For example: `vscode.csharp`. |
|
||||
| `extensionDependencies` | | `array` | An array with the ids of extensions that this extension depends on. These other extensions will be installed when the primary extension is installed. The id of an extension is always `${publisher}.${name}`. For example: `vscode.csharp`. |
|
||||
| `extensionKind` | | `array` | An array that indicates where the extension should run in remote configurations. Values are `ui` (run locally), `workspace` (run on remote machine) or both, with the order setting the preference. For example: `[ui, workspace]` indicates the extension can run in either location but prefers to run on the local machine. See [here](/api/advanced-topics/extension-host.md#preferred-extension-location) for more details. |
|
||||
| `extensionKind` | | `array` | An array that indicates where the extension should run in remote configurations. Values are `ui` (run locally), `workspace` (run on remote machine) or both, with the order setting the preference. For example: `[ui, workspace]` indicates the extension can run in either location but prefers to run on the local machine. See [here](/api/advanced-topics/extension-host#preferred-extension-location) for more details. |
|
||||
| `scripts` | | `object` | Exactly the same as [npm's `scripts`](https://docs.npmjs.com/misc/scripts) but with extra VS Code specific fields such as [vscode:prepublish](/api/working-with-extensions/publishing-extension#prepublish-step) or [vscode:uninstall](/api/references/extension-manifest#extension-uninstall-hook). |
|
||||
| `icon` | | `string` | The path to the icon of at least 128x128 pixels (256x256 for Retina screens). |
|
||||
|
||||
Also check [npm's `package.json` reference](https://docs.npmjs.com/files/package.json).
|
||||
Also check [npm's `package.json` reference](https://docs.npmjs.com/cli/v7/configuring-npm/package-json).
|
||||
|
||||
## Example
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ MetaDescription: Visual Studio Code when clause context reference.
|
|||
|
||||
Visual Studio Code sets various context keys and specific values depending on what elements are visible and active in the VS Code UI. These contexts can be used to selectively enable or disable extension commands and UI elements, such as menus and views.
|
||||
|
||||
For example, VS Codes uses when clauses to enable or disable command keybindings, which you can see in the Default Keybindings JSON (**Preferences: Open Default Keyboard Shortcuts (JSON)**):
|
||||
For example, VS Code uses when clauses to enable or disable command keybindings, which you can see in the Default Keybindings JSON (**Preferences: Open Default Keyboard Shortcuts (JSON)**):
|
||||
|
||||
```json
|
||||
{ "key": "f5", "command": "workbench.action.debug.start",
|
||||
|
|
|
|||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
DateApproved:
|
||||
MetaDescription:
|
||||
---
|
||||
|
||||
# Profiling Extensions
|
||||
|
|
@ -27,7 +27,7 @@ We initially looked at releasing our internal "Alpha" builds. Alpha builds are w
|
|||
|
||||
We decided that the overhead of releasing three different builds outweighed the benefits and the difference between weekly and nightly builds was actually low. We then considered retiring the Insiders builds and moving everyone to Alpha but decided that would leave dead ended installations of Insiders builds on everyone's desktops.
|
||||
|
||||
Instead, we've decided to build Insiders nightly from master, move our development team over to the Insiders builds, and retire our internal Alpha builds. We will do development on the same builds we make public.
|
||||
Instead, we've decided to build Insiders nightly from main, move our development team over to the Insiders builds, and retire our internal Alpha builds. We will do development on the same builds we make public.
|
||||
|
||||
For developers using Insiders builds, this means you now have access to fixes and new features a day after check in. If you are already using Insiders builds there is nothing for you to do, you will simply be notified when new builds are available, which will be daily starting in June.
|
||||
|
||||
|
|
|
|||
|
|
@ -11,10 +11,6 @@ Author: Chris Dias
|
|||
|
||||
May 10, 2017 Chris Dias, [@chrisdias](https://twitter.com/chrisdias)
|
||||
|
||||
## Watch the video
|
||||
|
||||
[Visual Studio Code: Conquering the Cloud with an Editor and a CLI](https://channel9.msdn.com/Events/Build/2017/B8094)
|
||||
|
||||
Below are links to the samples, tools, and extensions demonstrated in the Build 2017 VS Code talk.
|
||||
|
||||
## Samples
|
||||
|
|
@ -77,6 +73,6 @@ code --install-extension vscode-mongodb-0.0.1.vsix
|
|||
|
||||
* [Azure CLI Extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode.azurecli) provides a rich editing experience in VS Code for the [Azure CLI 2.0](https://aka.ms/GetTheAzureCLI).
|
||||
|
||||
* [Cosmos DB](https://docs.microsoft.com/en-us/azure/cosmos-db/mongodb-introduction) let's you host your MongoDB databases in Azure.
|
||||
* [Cosmos DB](https://docs.microsoft.com/azure/cosmos-db/mongodb-introduction) let's you host your MongoDB databases in Azure.
|
||||
|
||||
* [Kubernetes](https://kubernetes.io/) and [Kubernetes in Azure](https://docs.microsoft.com/en-us/azure/container-service/container-service-kubernetes-walkthrough).
|
||||
* [Kubernetes](https://kubernetes.io/) and [Kubernetes in Azure](https://docs.microsoft.com/azure/container-service/container-service-kubernetes-walkthrough).
|
||||
|
|
|
|||
|
|
@ -11,13 +11,13 @@ Author: Xiaokai He
|
|||
|
||||
September 28, 2017 Xiaokai He
|
||||
|
||||
For Java developers on Visual Studio Code, the [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension has been great for providing language features such as IntelliSense and project support. At the same time, we've also heard feedback that users would also like Java debugging. Today, we're excited to announce our ongoing collaboration with Red Hat and enabling Java developers to debug Java applications with a new lightweight [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) based on [Java Debug Server](https://github.com/microsoft/java-debug).
|
||||
For Java developers on Visual Studio Code, the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension has been great for providing language features such as IntelliSense and project support. At the same time, we've also heard feedback that users would also like Java debugging. Today, we're excited to announce our ongoing collaboration with Red Hat and enabling Java developers to debug Java applications with a new lightweight [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) based on [Java Debug Server](https://github.com/microsoft/java-debug).
|
||||
|
||||
|
||||
|
||||
>**Note**: Both the **Java Debugger for Visual Studio Code** and **Java Debug Server** will be open sourced shortly after the initial release.
|
||||
|
||||
To help Java developers to get started with VS Code quickly, we also created an [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack) which includes both the [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) and [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extensions so you won't need to search for them individually. This is just the start to creating a modern workflow for Java and we'll be adding more features and extensions to the **Extension Pack for Java** in the future.
|
||||
To help Java developers to get started with VS Code quickly, we also created an [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack) which includes both the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) and [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extensions so you won't need to search for them individually. This is just the start to creating a modern workflow for Java and we'll be adding more features and extensions to the **Extension Pack for Java** in the future.
|
||||
|
||||
## Getting started
|
||||
|
||||
|
|
@ -25,7 +25,7 @@ To get started:
|
|||
|
||||
1. In Visual Studio Code, open the **Extensions** view (`kb(workbench.view.extensions)`).
|
||||
2. Type "java" to filter the list.
|
||||
3. Find and install the [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack) or standalone [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extension if you already have [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) installed.
|
||||
3. Find and install the [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack) or standalone [Java Debugger for Visual Studio Code](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extension if you already have [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) installed.
|
||||
|
||||
You also install the **Extension Pack for Java** directly from this blog post:
|
||||
|
||||
|
|
@ -61,4 +61,4 @@ In this release, we support the following features:
|
|||
|
||||
Please share your feedback and ask questions to help us improve. You can contact us on [Gitter](https://gitter.im/Microsoft/vscode-java-debug).
|
||||
|
||||
Xiaokai He, [@JavaOnAzure](https://twitter.com/JavaOnAzure)
|
||||
Xiaokai He, [@JavaOnAzure](https://twitter.com/JavaOnAzure)
|
||||
|
|
|
|||
|
|
@ -82,7 +82,7 @@ Failure in the gating module will prevent an index ingestion and notifies the te
|
|||
|
||||
### Search Service
|
||||
|
||||
Finally, at runtime, the query from our users hits the [Azure Load Balancer](https://docs.microsoft.com/en-us/azure/load-balancer/load-balancer-overview) service that selects one of our geo-replicated servers to handle the query, based on its physical proximity or current load. The Search Service hosted at that location retrieves the relevant results with a lookup in the index, applies manual ranking overrides in some cases, and returns them to the VS Code client.
|
||||
Finally, at runtime, the query from our users hits the [Azure Load Balancer](https://docs.microsoft.com/azure/load-balancer/load-balancer-overview) service that selects one of our geo-replicated servers to handle the query, based on its physical proximity or current load. The Search Service hosted at that location retrieves the relevant results with a lookup in the index, applies manual ranking overrides in some cases, and returns them to the VS Code client.
|
||||
|
||||
## Putting it all together
|
||||
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@ Fixing isolated lines of code or adding tests was a reactive solution that only
|
|||
|
||||
The problem was that we couldn't just enable a compiler flag and everything would be magically fixed. The core VS Code codebase has some 1800 TypeScript files, comprising more than half a million lines. Compiling it with `"strictNullChecks": true` produced some 4500 errors. Ugh!
|
||||
|
||||
Furthermore, VS Code is made of a small core team and we like moving fast. Branching off the code to fix those 4500 strict null errors would have added a huge amount of engineering overhead. And where do you even start? Go through the list of errors top to bottom? In addition, changes in a branch would not help master, where the majority of the team would still be working.
|
||||
Furthermore, VS Code is made of a small core team and we like moving fast. Branching off the code to fix those 4500 strict null errors would have added a huge amount of engineering overhead. And where do you even start? Go through the list of errors top to bottom? In addition, changes in a branch would not help main, where the majority of the team would still be working.
|
||||
|
||||
We wanted a plan that would incrementally bring the benefits of strict null checking to all engineers on the team, starting right away. That way, we could break the work into manageable changes with each small change making the code a little bit safer.
|
||||
|
||||
|
|
|
|||
|
|
@ -10,6 +10,8 @@ Author: Brigit Murtaugh, Eric Amodio
|
|||
|
||||
June 10, 2021 by Brigit Murtaugh, [@BrigitMurtaugh](https://twitter.com/BrigitMurtaugh), Eric Amodio, [@eamodio](https://twitter.com/eamodio)
|
||||
|
||||
>**Note**: The Remote Repositories extension has been renamed to [GitHub Repositories](https://marketplace.visualstudio.com/items?itemName=github.remotehub) since this blog post was published.
|
||||
|
||||
We're excited to present the new [Remote Repositories](https://marketplace.visualstudio.com/items?itemName=github.remotehub) extension for Visual Studio Code! This is a new experience that we've been building in partnership with our friends at GitHub to enable working with source code repositories quickly and safely inside VS Code.
|
||||
|
||||
[](https://marketplace.visualstudio.com/items?itemName=github.remotehub)
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ Additionally, by reusing the existing tokens from the renderer and its increment
|
|||
|
||||
### VS Code for the Web
|
||||
|
||||
Besides being more performant, the new implementation is also supported in VS Code for the Web, which you can see in action as [github.dev](https://docs.github.com/en/codespaces/developing-in-codespaces/web-based-editor). Due to the way Bracket Pair Colorizer 2 reuses the VS Code token engine, it was not possible to migrate the extension to be what we call a [web extension](https://code.visualstudio.com/api/extension-guides/web-extensions).
|
||||
Besides being more performant, the new implementation is also supported in [VS Code for the Web](https://code.visualstudio.com/docs/editor/vscode-web), which you can see in action with [vscode.dev](https://vscode.dev) and [github.dev](https://docs.github.com/en/codespaces/developing-in-codespaces/web-based-editor). Due to the way Bracket Pair Colorizer 2 reuses the VS Code token engine, it was not possible to migrate the extension to be what we call a [web extension](https://code.visualstudio.com/api/extension-guides/web-extensions).
|
||||
|
||||
Not only does our new implementation work in VS Code for the Web, but also directly in the [Monaco Editor](https://microsoft.github.io/monaco-editor/)!
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:15eb0b6f906d01e0970342881c331f9d21bf38bd6da168a7bb06ea1f2b0716ef
|
||||
size 322209
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
---
|
||||
Order: 68
|
||||
TOCTitle: Webview UI Toolkit
|
||||
PageTitle: Webview UI Toolkit for Visual Studio Code
|
||||
MetaDescription: Announcing the public preview of the Webview UI Toolkit for Visual Studio Code
|
||||
Date: 2021-10-11
|
||||
Author: David Dossett
|
||||
---
|
||||
|
||||
# Webview UI Toolkit for Visual Studio Code
|
||||
|
||||
October 11, 2021 by David Dossett, [@david_dossett](https://twitter.com/david_dossett) and Hawk Ticehurst, [@hawkticehurst](https://twitter.com/hawkticehurst)
|
||||
|
||||
We're so excited to announce the public preview of the [Webview UI Toolkit for Visual Studio Code](https://github.com/microsoft/vscode-webview-ui-toolkit). With this toolkit, extensions developers can quickly and easily create [webview-based extensions](https://code.visualstudio.com/api/extension-guides/webview) in Visual Studio Code that look, feel, and act like the editor itself.
|
||||
|
||||
|
||||
|
||||
## What is the Webview UI Toolkit?
|
||||
|
||||
At its core, the toolkit is a library of components that developers can use to build user interfaces inside extension webviews. Note that this doesn't change our recommendation to [avoid the use of webviews](https://code.visualstudio.com/api/references/extension-guidelines#webviews) in extensions unless you absolutely need them.
|
||||
|
||||
Features of the library include:
|
||||
|
||||
- **Implements the Visual Studio Code design language:** Create extensions that have a consistent look and feel with the rest of the editor.
|
||||
- **Automatic support for color themes:** All components are designed with theming in mind and will automatically display the current editor theme.
|
||||
- **Use any tech stack:** The library ships as a set of web components, meaning developers can use the toolkit no matter what tech stack (React, Vue, Svelte, etc.) their extension is built with.
|
||||
- **Accessible out of the box:** All components ship with web standard compliant ARIA labels and keyboard navigation.
|
||||
|
||||
## Why did we build it?
|
||||
|
||||
We wanted to ensure that extensions that use webviews are predictable, consistent, and accessible for their users.
|
||||
|
||||
Any time an extension uses the [Webview API](https://code.visualstudio.com/api/extension-guides/webview), the responsibility of creating UI that adheres to the webview guidelines lies with the extension author. As a result, webviews run the risk of appearing and behaving differently than the rest of Visual Studio Code. In the worst cases, users must navigate inaccessible extension UIs that look nothing like the rest of the editor.
|
||||
|
||||
With the Webview UI Toolkit, we now share some of that responsibility with extension authors. We get to worry about the nitty gritty details of theming, accessibility, and behavioral/styling implementation of core UI components so you don't have to. It means improved ease of development, improved developer velocity, and ultimately more time to work on the parts of your extension that make it unique!
|
||||
|
||||
## We need your feedback!
|
||||
|
||||
We can't wait for you to give the Webview UI Toolkit a try! Let us know how we can improve the experience for creating webview-based extensions as we move towards a 1.0 release.
|
||||
|
||||
If you'd like to learn more, you can refer to the [Webview UI Toolkit for Visual Studio Code](https://github.com/microsoft/vscode-webview-ui-toolkit) documentation. Additionally, if you have any questions, encounter any issues, or have feature requests, please don’t hesitate to reach out.
|
||||
|
||||
Happy Coding,
|
||||
|
||||
David and Hawk
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:599eec21bfc74b8929d343beb175b7ef4046de4d79aafac7a785fab3eae2d30c
|
||||
size 43603
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:67ecb19c942cae5a8e69d4f4bcd490eb336b77927f73ea9e68df77bf27fb3f85
|
||||
size 56578
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:ccbb48ef71d39da2f7a5bcd4f55186f2f53a78d8bfbd16f8f75d2a6a7846a85e
|
||||
size 1048234
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:0452975cbc90f2538a93e10c177afe94f3f5e0a2bf76a913cb184e8a08df064e
|
||||
size 83505
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:3d1a5fc395aea3daa802386fbf34751b467c206883f72d48871f8a387e46f64c
|
||||
size 44974
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:e50b50ae3d996d0e7f9a9f8ac8994d0ad60e4cf1c23fbb971666bb2ae4d25269
|
||||
size 1055702
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:3f7ae5957531fe048d72f063f422b6a696eedefddacd9818ba7fca53c9f86412
|
||||
size 1044591
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:a8a587523b185806ad68e1441499a080c81f23b57881bdc011c1928b7741af10
|
||||
size 949568
|
||||
|
|
@ -0,0 +1,123 @@
|
|||
---
|
||||
Order: 69
|
||||
TOCTitle: vscode.dev
|
||||
PageTitle: vscode.dev Visual Studio Code for the Web
|
||||
MetaDescription: Announcing vscode.dev Visual Studio Code for the Web
|
||||
Date: 2021-10-20
|
||||
Author: Chris Dias
|
||||
---
|
||||
|
||||
# vscode.dev(!)
|
||||
|
||||
October 20, 2021 by Chris Dias, [@chrisdias](https://twitter.com/chrisdias)
|
||||
|
||||
Back in 2019, when the `.dev` top-level domain opened, we picked up `vscode.dev` and quickly parked it, pointing at our website `code.visualstudio.com` (or, if you are from the Boston area like me, we "pahked it"). Like a lot of people who buy a `.dev` domain, we had no idea what we were going to do with it. And we certainly didn't anticipate that it would end up being the fulfillment of a mission over a decade in the making.
|
||||
|
||||
## Bringing VS Code to the browser
|
||||
|
||||
Fast forward to today. Now when you go to [https://vscode.dev](https://vscode.dev), you'll be presented with a lightweight version of VS Code running fully in the browser. Open a folder on your local machine and start coding.
|
||||
|
||||
No install required.
|
||||
|
||||
[](/assets/blogs/2021/10/20/vscode-dev.png)
|
||||
|
||||
With the availability of vscode.dev, we begin to finally realize our original vision of building a development tool that can run fully serverless in the browser. For a full history lesson, check out Erich Gamma's VS Code Day talk ["VS Code An Overnight Success…10 Years in the Making"](https://www.youtube.com/watch?v=hilznKQij7A&list=PLj6YeMhvp2S6uB23beQaffszlavLq3lNq).
|
||||
|
||||
So, what can you do on VS Code for the Web? Quite a bit actually…
|
||||
|
||||
## Local development with cloud tools
|
||||
|
||||
[](/assets/blogs/2021/10/20/the-cat-said-no-vscode-dev.png)
|
||||
|
||||
Modern browsers that support the [File System Access API](https://developer.mozilla.org/docs/Web/API/File_System_Access_API) (Edge and Chrome today) allow web pages to access the local file system (with your permission). This simple gateway to the local machine quickly opens some interesting scenarios for using VS Code for the Web as a zero-installation local development tool, such as:
|
||||
|
||||
* Local file viewing and editing. Quickly take notes (and preview!) in Markdown. Even if you are on a restricted machine where you cannot install the full VS Code, you may still be able to use vscode.dev to view and edit local files.
|
||||
* Build client-side HTML, JavaScript, and CSS applications in conjunction with the browser tools for debugging.
|
||||
* Edit your code on lower powered machines like Chromebooks, where you can't ([easily](https://code.visualstudio.com/blogs/2020/12/03/chromebook-get-started)) install VS Code.
|
||||
* Develop on your iPad. You can upload/download files (and even store them in the cloud using the Files app), as well as open repositories remotely with the built-in GitHub Repositories extension.
|
||||
|
||||
And, if your browser doesn't support local file system APIs, you'll still be able to open individual files by uploading and downloading them via the browser.
|
||||
|
||||
|
||||
|
||||
**A Light(er)weight Experience**
|
||||
|
||||
Since VS Code for the Web is running completely within the browser, some experiences will naturally be more constrained, when compared to what you can do in the desktop app. For example, the terminal and debugger are not available, which makes sense since you can't compile, run, and debug a Rust or Go application within the browser sandbox (although emerging technologies like Pyodide and web containers may someday change this).
|
||||
|
||||
A bit more nuanced are the code editing, navigation, and browsing experiences, which, on the desktop, are generally powered by language services and compilers that expect a file system, runtime, and compute environment. In the browser, these experiences are powered by language services *running fully in the browser* (no file system, no runtimes) that provide source code tokenization and syntax colorization, completions, and many single-file operations.
|
||||
|
||||
As a result, when in the browser, experiences generally fall into the following categories:
|
||||
|
||||
**Good**: For most programming languages, vscode.dev gives you code syntax colorization, text-based completions, and [bracket pair colorization](https://code.visualstudio.com/blogs/2021/09/29/bracket-pair-colorization). Using a [Tree-sitter](https://tree-sitter.github.io/tree-sitter) syntax tree, we're able to [provide additional experiences](https://github.com/microsoft/vscode-anycode) such as [Outline/Go to Symbol](https://code.visualstudio.com/docs/editor/editingevolved#_go-to-symbol) and [Symbol Search](https://code.visualstudio.com/docs/editor/editingevolved#_open-symbol-by-name) for popular languages such as C/C++, C#, Java, PHP, Rust, and Go.
|
||||
|
||||
**Better**: The TypeScript, JavaScript, and [Python](https://devblogs.microsoft.com/python/python-in-visual-studio-code-september-2021-release/#a-rich-python-editing-experience-in-the-browser-via-github-dev) experiences are all powered by language services that run natively in the browser. With these programming languages, you'll get the "**Good**" experience plus rich single file completions, semantic highlighting, syntax errors, and more.
|
||||
|
||||
**Best**: For many "webby" languages, such as JSON, HTML, CSS, and LESS, the coding experience in vscode.dev is nearly identical to the desktop (including Markdown preview!).
|
||||
|
||||
## Extensions
|
||||
|
||||
Most UI customization extensions such as themes, key maps, and snippets all work in vscode.dev and you can even enable roaming between the browser, the desktop, and GitHub Codespaces through [Settings Sync](https://code.visualstudio.com/docs/editor/settings-sync).
|
||||
|
||||
Extensions that run Node.js code that use OS-specific modules, or shell out to local executables, still show in search results, but are clearly marked as unavailable.
|
||||
|
||||
|
||||
|
||||
That said, there are a growing number of extensions that have been updated to work in the browser, with more coming every day.
|
||||
|
||||
>**Note**: If you are an extension author and want to have your extension available in the browser (we do!), check out our [Web Extensions authoring guide](https://code.visualstudio.com/api/extension-guides/web-extensions).
|
||||
|
||||
For example, the [Luna Paint - Image Editor](https://marketplace.visualstudio.com/items?itemName=Tyriar.luna-paint) extension lets you edit raster images directly in VS Code. The extension brings rich design tools (for example, layer and blend tools) to VS Code, and of course you can save images to your local disk.
|
||||
|
||||
[](/assets/blogs/2021/10/20/luna-paint-vscode-dev.png)
|
||||
|
||||
The [GitHub Issue Notebooks](https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-github-issue-notebooks) extension brings the Notebook experience to GitHub Issues. With that you can interleave queries, results, and even Markdown describing the purpose of the queries, together into a single editor.
|
||||
|
||||
[](/assets/blogs/2021/10/20/github-issue-notebooks-vscode-dev.png)
|
||||
|
||||
## GitHub
|
||||
|
||||
Many extensions for VS Code work with source code that is stored in GitHub. For example, the [CodeTour](https://marketplace.visualstudio.com/items?itemName=vsls-contrib.codetour) extension lets you create guided walkthroughs of a code base and the [WikiLens](https://marketplace.visualstudio.com/items?itemName=lostintangent.wikilens) extension turns VS Code and your repository into a powerful note taking tool (with bi-directional linking). To make it easy to access your code in GitHub, VS Code for the Web comes with the [GitHub Repositories](https://code.visualstudio.com/docs/editor/github#_github-repositories-extension), [Codespaces](https://code.visualstudio.com/docs/remote/codespaces), and [Pull Request](https://code.visualstudio.com/docs/editor/github#_getting-started-with-github-pull-requests-and-issues) extensions built in. You can make quick edits, review PRs, and **Continue on** to a local clone or even better, to a [GitHub Codespace](https://github.com/features/codespaces), if you want more powerful language experiences or need to build, run, and test the changes prior to merging the commits.
|
||||
|
||||
|
||||
|
||||
Whoa, sounds a lot like `github.dev` doesn't it? Are they different? The same? Why two??!!
|
||||
|
||||
Good question(s)! `github.dev` is a customized instance of VS Code for the Web that is deeply integrated into GitHub. Login is automatic, the URL format follows github.com's `/organization/repo` model so that you can simply change `.com` to `.dev` to edit a repo, and it is customized for GitHub with the light and dark themes.
|
||||
|
||||
In addition to repositories on GitHub, VS Code for the Web supports Azure Repos (part of Azure DevOps). To work with both, VS Code for the Web supports two routes, `vscode.dev/github` and `vscode.dev/azurerepos`. You don't have to remember that though, simply prefix whatever URL you have with "vscode.dev".
|
||||
|
||||
For example, change `https://github.com/microsoft/vscode` to 'https://**vscode.dev**/github.com/Microsoft/vscode'.
|
||||
|
||||
For Azure Repos, do the same. Change `https://dev.azure.com/…` to 'https://**vscode.dev**/dev.azure.com /…'.
|
||||
|
||||
Today, support for Azure Repos is in preview mode for reading repositories, but we're working hard to bring full read/write capabilities as soon as we can.
|
||||
|
||||
If you are not on GitHub or Azure DevOps, support for additional repository hosting services can be provided through extensions, just like on the desktop. Those extensions, as noted above, will need to support running fully in the browser.
|
||||
|
||||
## Speaking of URLs…
|
||||
|
||||
Like in the desktop, you can customize VS Code for the Web through a rich ecosystem of extensions that support just about every back end, language, and service. Unlike in the desktop, it's easy for us to deliver customized experiences with pre-installed extensions through unique `vscode.dev` URLs (like `vscode.dev/github` and `vscode.dev/azurerepos` as mentioned above).
|
||||
|
||||
For example, try browsing to [https://vscode.dev/theme/sdras.night-owl](https://vscode.dev/theme/sdras.night-owl).
|
||||
|
||||
[](/assets/blogs/2021/10/20/night-owl-theme-vscode-dev.png)
|
||||
|
||||
Here you can experience the popular [Night Owl](https://marketplace.visualstudio.com/items?itemName=sdras.night-owl) color theme by [@sarah_edo](https://twitter.com/sarah_edo) "live", without having to go through the download and install process, just to see if you like it. No install necessary! If you are a theme author, you can even create a badge in your `README.md` to let users test drive your theme directly from the Marketplace (learn more in the [VS Code for the Web](https://code.visualstudio.com/docs/editor/vscode-web#_themes) user guide).
|
||||
|
||||
Feel free to use this URL to share your favorite themes with friends. Personally, I'm a big fan of [@wesbos](https://twitter.com/wesbos)' [Cobalt2](https://marketplace.visualstudio.com/items?itemName=wesbos.theme-cobalt2) theme, check out [https://vscode.dev/theme/wesbos.theme-cobalt2](https://vscode.dev/theme/wesbos.theme-cobalt2). Note, the `theme` URL only works with themes that are fully declarative (no code).
|
||||
|
||||
As you can see, `vscode.dev` URLs are a powerful way for us to deliver new, lightweight experiences. Another example is that Live Share guest sessions will also be available in the browser through the `https://vscode.dev/liveshare` URL. The `sessionId` will be passed to the extension to make joining a seamless experience.
|
||||
|
||||
|
||||
|
||||
The possibilities with `vscode.dev` URLs are endless, and we've got a lot of ideas that we're excited to share with you in the coming months.
|
||||
|
||||
## Where to next?
|
||||
|
||||
Bringing VS Code to the browser is the realization of the original vision for the product. It is also the start of a completely new one. An ephemeral editor that is available to anyone with a browser and an internet connection is the foundation for a future where we can truly edit anything from anywhere.
|
||||
|
||||
Stay tuned for more… 😉
|
||||
|
||||
Happy Coding,
|
||||
|
||||
Chris
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:12b1e798ed1bbccf7c2a642a232bd3cb21c921817cb5db0960e926b4872ce54f
|
||||
size 1459135
|
||||
|
|
@ -240,6 +240,11 @@
|
|||
<changefreq>weekly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://code.visualstudio.com/docs/editor/vscode-web</loc>
|
||||
<changefreq>weekly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://code.visualstudio.com/docs/editor/debugging</loc>
|
||||
<changefreq>weekly</changefreq>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Deploy to Azure
|
||||
ContentId: 044913F5-F99D-4228-A916-0443260AB7FB
|
||||
PageTitle: Deploy a containerized app to Azure App Service
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 10/28/2020
|
||||
MetaDescription: Using Visual Studio Code, build a container image for your application, push the image to a container registry, and deploy to Azure App Service.
|
||||
---
|
||||
# Deploy to Azure App Service
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Develop with Kubernetes
|
||||
ContentId: 80bd336b-0d2d-4d63-a771-8b3ea22a64d3
|
||||
PageTitle: Use Bridge to Kubernetes to run and debug locally with Kubernetes
|
||||
DateApproved: 04/14/2021
|
||||
DateApproved: 10/7/2021
|
||||
MetaDescription: Learn how to use Bridge to Kubernetes.
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Choose a dev environment
|
||||
ContentId: AF3D8F58-8F73-44CD-962C-B7F029E50478
|
||||
PageTitle: Choosing an environment for container development
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 09/14/2020
|
||||
MetaDescription: Guidance on choosing remote or local environments for developing and debugging containerized apps, using Visual Studio Code.
|
||||
---
|
||||
# Your development environment
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Debug
|
||||
ContentId: A1371726-5310-4923-B43B-240F36C6264E
|
||||
PageTitle: Debug an app running in a Docker container
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 07/16/2021
|
||||
MetaDescription: Debug an app running in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
# Debug containerized apps
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
Area: containers
|
||||
ContentId: B1DF33C0-400C-413D-B60B-D1AA278F6DE3
|
||||
PageTitle: Debug a .NET Core app running in a Docker container
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 04/15/2021
|
||||
MetaDescription: Debug a .NET Core app running in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
# Debug .NET Core within a container
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
Area: containers
|
||||
ContentId: F0C800DD-C477-492D-9545-745F570FE042
|
||||
PageTitle: Configure and troubleshoot debugging of Node.js apps running in a Docker container
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 09/23/2020
|
||||
MetaDescription: How to configure and troubleshoot debugging of Node.js apps running in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
Area: containers
|
||||
ContentId: f9ffec31-9253-4f71-a4eb-79ea7b3a8f55
|
||||
PageTitle: Configure and troubleshoot debugging of Python apps running in a Docker container
|
||||
DateApproved: 03/05/2020
|
||||
DateApproved: 07/26/2021
|
||||
MetaDescription: How to configure and troubleshoot debugging of Python apps running in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Docker Compose
|
||||
ContentId: c63d86a0-48f8-4724-ba24-fa5ce4199632
|
||||
PageTitle: Use Docker Compose to work with multiple containers
|
||||
DateApproved: 04/21/2020
|
||||
DateApproved: 07/16/2021
|
||||
MetaDescription: Develop a multi-container app running in a Docker containers using Docker Compose and Visual Studio Code.
|
||||
---
|
||||
# Use Docker Compose
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Overview
|
||||
ContentId: 4B462667-8915-4BE0-B8D0-EDE51CB2D273
|
||||
PageTitle: Container tools extension for Visual Studio Code
|
||||
DateApproved: 07/31/2020
|
||||
DateApproved: 07/16/2021
|
||||
MetaDescription: Tools for developing and debugging with Docker containers, using Visual Studio Code.
|
||||
---
|
||||
# Working with containers
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
Area: containers
|
||||
ContentId: 1ebbceb6-ae61-4b98-953d-0b18323becc4
|
||||
PageTitle: Configure your Python containers
|
||||
DateApproved: 03/03/2021
|
||||
DateApproved: 03/15/2021
|
||||
MetaDescription: How to setup a non-root user for VS Code Docker extension
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: ASP.NET Core
|
||||
ContentId: 29F731D4-C6FE-4742-A1E7-7288FDB81CB9
|
||||
PageTitle: Build and run an ASP.NET Core app in a container
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 10/28/2020
|
||||
MetaDescription: Develop, build, and debug an ASP.NET Core app in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
# ASP.NET Core in a container
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Registries
|
||||
ContentId: 318A4299-AF24-4ADA-863D-E73B314FC440
|
||||
PageTitle: Quickstart - Using container registries
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 04/21/2020
|
||||
MetaDescription: Work with Docker container registries in Visual Studio Code
|
||||
---
|
||||
# Using container registries
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Node.js
|
||||
ContentId: A963901F-BF3F-455F-AD75-AB54EAE72BEF
|
||||
PageTitle: Build and run a Node.js app in a container
|
||||
DateApproved: 07/31/2020
|
||||
DateApproved: 10/28/2020
|
||||
MetaDescription: Develop, build, and debug a Node.js app in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
# Node.js in a container
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Python
|
||||
ContentId: 3a9bc520-95e2-416e-a0ac-5be02a38c4c3
|
||||
PageTitle: Build and run a Python app in a container
|
||||
DateApproved: 2/18/2020
|
||||
DateApproved: 06/15/2021
|
||||
MetaDescription: Develop, build, and debug a Python app in a Docker container, using Visual Studio Code.
|
||||
---
|
||||
# Python in a container
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: containers
|
|||
TOCTitle: Customize
|
||||
ContentId: 6784FBBE-9EE4-44A8-AC48-A52617EB1968
|
||||
PageTitle: Reference for Visual Studio Code Docker extension properties and tasks.
|
||||
DateApproved: 3/5/2020
|
||||
DateApproved: 08/05/2021
|
||||
MetaDescription: Reference for Docker build and Docker run tasks and properties in the Visual Studio Code Docker extension.
|
||||
---
|
||||
# Customize the Docker extension
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
Area: containers
|
||||
ContentId: DDE07043-BA8C-4D75-B392-ABACC31F6EA8
|
||||
PageTitle: Connect to Docker engine running on a remote machine
|
||||
DateApproved: 01/29/2020
|
||||
DateApproved: 08/16/2021
|
||||
MetaDescription: Connect via SSH to Docker engine running on a remote machine and use the remote machine as a development environment for Visual Studio Code.
|
||||
---
|
||||
# Connect to remote Docker over SSH
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ TOCTitle: Tips and Tricks
|
|||
PageTitle: Visual Studio Code Docker development troubleshooting Tips and Tricks
|
||||
ContentId: 79bb60fd-5248-43d2-8801-34b9fc2ec543
|
||||
MetaDescription: Visual Studio Code Docker development troubleshooting tips and tricks
|
||||
DateApproved: 07/12/2021
|
||||
DateApproved: 07/16/2021
|
||||
---
|
||||
# Docker Tools Tips and Tricks
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ Area: containers
|
|||
TOCTitle: Push Django Images to a Registry
|
||||
ContentId: 4eb2543d-84a7-4e11-b835-0d238ce7ed7a
|
||||
PageTitle: Push Django images to a registry in Visual Studio Code
|
||||
DateApproved: 02/18/2020
|
||||
DateApproved: 04/01/2020
|
||||
MetaDescription: How to push a Django image to a container registry using the VS Code docker extension
|
||||
MetaSocialImage: images/tutorial/social.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ The Notebook Editor makes it easy to create, edit, and run code cells within you
|
|||
|
||||
### Create a code cell
|
||||
|
||||
By default, a blank Notebook will have an empty code cell for you to start with.
|
||||
By default, a blank Notebook will have an empty code cell for you to start with and an existing Notebook will place one at the bottom. Add your code to the empty code cell to get started.
|
||||
|
||||
```python
|
||||
msg = "Hello world"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: datascience
|
|||
TOCTitle: Python Interactive
|
||||
ContentId: 09645514-3c23-49ec-8e27-71831bc06ce7
|
||||
PageTitle: Working with Jupyter code cells in the Python Interactive window
|
||||
DateApproved: 6/15/2021
|
||||
DateApproved: 10/7/2021
|
||||
MetaDescription: Working with Jupyter code cells in the Python Interactive window
|
||||
MetaSocialImage: images/tutorial/social.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 18
|
||||
Order: 19
|
||||
Area: editor
|
||||
TOCTitle: Accessibility
|
||||
ContentId: 62894B41-CC33-400A-8A56-8C761C77B4C7
|
||||
|
|
@ -102,6 +102,10 @@ The setting `terminal.integrated.minimumContrastRatio` can be set to a number be
|
|||
|
||||
Once a focus is in the Status bar via **Focus Next Part** (`kb(workbench.action.focusNextPart)`) arrow navigation can be used to move focus between Status bar entries.
|
||||
|
||||
### Diff editor accessibility
|
||||
|
||||
There is a review pane in the Diff editor that presents changes in a unified patch format. You can navigate between changes with **Go to Next Difference** (`kb(editor.action.diffReview.next)`) and **Go to Previous Difference** (`kb(editor.action.diffReview.prev)`). Lines can be navigated with arrow keys and pressing `kbstyle(Enter)` will jump back in the Diff editor and the selected line.
|
||||
|
||||
## Debugger accessibility
|
||||
|
||||
The VS Code debugger UI is user accessible and has the following features:
|
||||
|
|
@ -125,7 +129,7 @@ There is screen reader support for the editor with VoiceOver.
|
|||
Screen reader support for the editor is still work in progress because the accessibility implementation for Chrome on Linux is work in progress.
|
||||
Thus there are a couple of things needed in order to have screen reader Orca working with VS Code:
|
||||
|
||||
* Make sure to use the latest version of Orca out of master. More details can be found on the [Orca page](https://gitlab.gnome.org/GNOME/orca/-/blob/master/README.md).
|
||||
* Make sure to use the latest version of Orca out of the master branch. More details can be found on the [Orca page](https://gitlab.gnome.org/GNOME/orca/-/blob/master/README.md).
|
||||
* We have tested that VS Code works well with Orca on Ubuntu 18, Fedora 31, Arch Linux. With Ubuntu 19, we have encountered issues.
|
||||
* Make sure to have the setting `"editor.accessibilitySupport": "on"` in VS Code. You can do this using settings, or by running the **Show Accessibility Help** command and pressing `kbstyle(Ctrl+E)` to turn on accessibilitySupport.
|
||||
* If Orca is still silent, try setting `ACCESSIBILITY_ENABLED=1` as an environment variable.
|
||||
|
|
|
|||
|
|
@ -195,6 +195,16 @@ When you type text into the Replace text box, you will see a diff display of the
|
|||
|
||||
>**Tip:** You can quickly reuse a previous search term by using `kb(history.showNext)` and `kb(history.showPrevious)` to navigate through your search term history.
|
||||
|
||||
### Case changing in regex replace
|
||||
|
||||
VS Code supports changing the case of regex matching groups while doing Search and Replace in the editor or globally. This is done with the modifiers `\u\U\l\L`, where `\u` and `\l` will upper/lowercase a single character, and `\U` and `\L` will upper/lowercase the rest of the matching group.
|
||||
|
||||
Example:
|
||||
|
||||
|
||||
|
||||
The modifiers can also be stacked - for example, `\u\u\u$1` will uppercase the first three characters of the group, or `\l\U$1` will lowercase the first character, and uppercase the rest. The capture group is referenced by `$n` in the replacement string, where `n` is the order of the capture group.
|
||||
|
||||
## IntelliSense
|
||||
|
||||
We'll always offer word completion, but for the rich [languages](/docs/languages/overview.md), such as JavaScript, JSON, HTML, CSS, SCSS, Less, C# and TypeScript, we offer a true IntelliSense experience. If a language service knows possible completions, the IntelliSense suggestions will pop up as you type. You can always manually trigger it with `kb(editor.action.triggerSuggest)`. By default, `kbstyle(Tab)` or `kbstyle(Enter)` are the accept keyboard triggers but you can also [customize these key bindings](/docs/getstarted/keybindings.md).
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 15
|
||||
Order: 16
|
||||
Area: editor
|
||||
TOCTitle: Command Line
|
||||
ContentId: 8faef870-7a5f-4070-ad17-8ba791006912
|
||||
|
|
@ -9,7 +9,7 @@ MetaDescription: Visual Studio Code command-line options (switches).
|
|||
---
|
||||
# Command Line Interface (CLI)
|
||||
|
||||
Visual Studio Code has a powerful command line interface built-in that lets you control how you launch the editor. You can open files, install extensions, change the display language, and output diagnostics through command-line options (switches).
|
||||
Visual Studio Code has a powerful command-line interface built-in that lets you control how you launch the editor. You can open files, install extensions, change the display language, and output diagnostics through command-line options (switches).
|
||||
|
||||
|
||||
|
||||
|
|
@ -17,7 +17,7 @@ If you are looking for how to run command-line tools inside VS Code, see the [In
|
|||
|
||||
## Command line help
|
||||
|
||||
To get an overview of the VS Code command line interface, open a terminal or command prompt and type `code --help`. You will see the version, usage example, and list of command line options.
|
||||
To get an overview of the VS Code command-line interface, open a terminal or command prompt and type `code --help`. You will see the version, usage example, and list of command line options.
|
||||
|
||||
|
||||
|
||||
|
|
@ -29,7 +29,7 @@ You can launch VS Code from the command line to quickly open a file, folder, or
|
|||
|
||||
**Note:** Users on macOS must first run a command (**Shell Command: Install 'code' command in PATH**) to add VS Code executable to the `PATH` environment variable. Read the [macOS setup guide](/docs/setup/mac.md) for help.
|
||||
|
||||
Windows and Linux installations should add the VS Code binaries location to your system path. If this isn't the case, you can manually add the location to the `Path` environment variable (`$PATH` on Linux). For example, on Windows, VS Code is installed under `AppData\Local\Programs\Microsoft VS Code\bin`. To review platform specific setup instructions, see [Setup](/docs/setup/setup-overview.md).
|
||||
Windows and Linux installations should add the VS Code binaries location to your system path. If this isn't the case, you can manually add the location to the `Path` environment variable (`$PATH` on Linux). For example, on Windows, VS Code is installed under `AppData\Local\Programs\Microsoft VS Code\bin`. To review platform-specific setup instructions, see [Setup](/docs/setup/setup-overview.md).
|
||||
|
||||
> **Insiders:** If you are using the VS Code [Insiders](/insiders) preview, you launch your Insiders build with `code-insiders`.
|
||||
|
||||
|
|
@ -40,7 +40,7 @@ Here are optional arguments you can use when starting VS Code at the command lin
|
|||
Argument|Description
|
||||
------------------|-----------
|
||||
`-h` or `--help` | Print usage
|
||||
`-v` or `--version` | Print VS Code version (for example, 1.22.2), GitHub commit id, and architecture (for example, x64).
|
||||
`-v` or `--version` | Print VS Code version (for example, 1.22.2), GitHub commit ID, and architecture (for example, x64).
|
||||
`-n` or `--new-window`| Opens a new session of VS Code instead of restoring the previous session (default).
|
||||
`-r` or `--reuse-window` | Forces opening a file or folder in the last active window.
|
||||
`-g` or `--goto` | When used with *file:line[:character]*, opens a file at a specific line and optional character position. This argument is provided since some operating systems permit `:` in a file name.
|
||||
|
|
@ -150,7 +150,7 @@ Read on to find out about:
|
|||
|
||||
### 'code' is not recognized as an internal or external command
|
||||
|
||||
Your OS cannot find the VS Code binary `code` on its path. The VS Code Windows and Linux installations should have installed VS Code on your path. Try uninstalling and reinstalling VS Code. If `code` is still not found, consult the platform specific setup topics for [Windows](/docs/setup/windows.md) and [Linux](/docs/setup/linux.md).
|
||||
Your OS cannot find the VS Code binary `code` on its path. The VS Code Windows and Linux installations should have installed VS Code on your path. Try uninstalling and reinstalling VS Code. If `code` is still not found, consult the platform-specific setup topics for [Windows](/docs/setup/windows.md) and [Linux](/docs/setup/linux.md).
|
||||
|
||||
On macOS, you need to manually run the **Shell Command: Install 'code' command in PATH** command (available through the **Command Palette** `kb(workbench.action.showCommands)`). Consult the [macOS](/docs/setup/mac.md) specific setup topic for details.
|
||||
|
||||
|
|
@ -160,4 +160,4 @@ VS Code has an [Integrated Terminal](/docs/editor/integrated-terminal.md) where
|
|||
|
||||
### Can I specify the settings location for VS Code in order to have a portable version?
|
||||
|
||||
Not directly through the command line, but VS Code has a [Portable Mode](/docs/editor/portable.md) which lets you keep settings and data in the same location as your installation, for example, on a USB drive.
|
||||
Not directly through the command line, but VS Code has a [Portable Mode](/docs/editor/portable.md), which lets you keep settings and data in the same location as your installation, for example, on a USB drive.
|
||||
|
|
|
|||
|
|
@ -160,6 +160,8 @@ Breakpoints can be toggled by clicking on the **editor margin** or using `kb(edi
|
|||
* Disabled breakpoints have a filled gray circle.
|
||||
* When a debugging session starts, breakpoints that cannot be registered with the debugger change to a gray hollow circle. The same might happen if the source is edited while a debug session without live-edit support is running.
|
||||
|
||||
If the debugger supports breaking on different kinds of errors or exceptions, those will also be available in the **BREAKPOINTS** view.
|
||||
|
||||
The **Reapply All Breakpoints** command sets all breakpoints again to their original location. This is helpful if your debug environment is "lazy" and "misplaces" breakpoints in source code that has not yet been executed.
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 14
|
||||
Order: 15
|
||||
Area: editor
|
||||
TOCTitle: Emmet
|
||||
ContentId: baf4717c-ea52-486e-9ea3-7bf1c4134dad
|
||||
|
|
@ -198,8 +198,8 @@ Do not use `:` in the snippet name. `:` is used to separate property name and va
|
|||
|
||||
The syntax for tab stops in custom Emmet snippets follows the [Textmate snippets syntax](https://manual.macromates.com/en/snippets).
|
||||
|
||||
- Use `${1}`, `${2}` for tab stops and `${1:placeholder}` for tab stops with placeholders.
|
||||
- Previously, `|` or `${cursor}` was used to denote the cursor location in the custom Emmet snippet. This is no longer supported. Use `${1}` instead.
|
||||
* Use `${1}`, `${2}` for tab stops and `${1:placeholder}` for tab stops with placeholders.
|
||||
* Previously, `|` or `${cursor}` was used to denote the cursor location in the custom Emmet snippet. This is no longer supported. Use `${1}` instead.
|
||||
|
||||
## Emmet configuration
|
||||
|
||||
|
|
@ -227,6 +227,7 @@ Below are Emmet [settings](/docs/getstarted/settings.md) that you can use to cus
|
|||
See [Emmet Customization of output profile](https://docs.emmet.io/customization/syntax-profiles/#create-your-own-profile) to learn how you can customize the output of your HTML abbreviations.
|
||||
|
||||
For example:
|
||||
|
||||
```json
|
||||
"emmet.syntaxProfiles": {
|
||||
"html": {
|
||||
|
|
@ -243,6 +244,7 @@ Below are Emmet [settings](/docs/getstarted/settings.md) that you can use to cus
|
|||
Customize variables used by Emmet snippets.
|
||||
|
||||
For example:
|
||||
|
||||
```json
|
||||
"emmet.variables": {
|
||||
"lang": "de",
|
||||
|
|
@ -286,24 +288,25 @@ Below are Emmet [settings](/docs/getstarted/settings.md) that you can use to cus
|
|||
* `emmet.preferences`
|
||||
|
||||
You can use this setting to customize Emmet as documented in [Emmet Preferences](https://docs.emmet.io/customization/preferences/). The below customizations are currently supported:
|
||||
- `css.propertyEnd`
|
||||
- `css.valueSeparator`
|
||||
- `sass.propertyEnd`
|
||||
- `sass.valueSeparator`
|
||||
- `stylus.propertyEnd`
|
||||
- `stylus.valueSeparator`
|
||||
- `css.unitAliases`
|
||||
- `css.intUnit`
|
||||
- `css.floatUnit`
|
||||
- `bem.elementSeparator`
|
||||
- `bem.modifierSeparator`
|
||||
- `filter.commentBefore`
|
||||
- `filter.commentTrigger`
|
||||
- `filter.commentAfter`
|
||||
- `format.noIndentTags`
|
||||
- `format.forceIndentationForTags`
|
||||
- `profile.allowCompactBoolean`
|
||||
- `css.fuzzySearchMinScore`
|
||||
|
||||
* `css.propertyEnd`
|
||||
* `css.valueSeparator`
|
||||
* `sass.propertyEnd`
|
||||
* `sass.valueSeparator`
|
||||
* `stylus.propertyEnd`
|
||||
* `stylus.valueSeparator`
|
||||
* `css.unitAliases`
|
||||
* `css.intUnit`
|
||||
* `css.floatUnit`
|
||||
* `bem.elementSeparator`
|
||||
* `bem.modifierSeparator`
|
||||
* `filter.commentBefore`
|
||||
* `filter.commentTrigger`
|
||||
* `filter.commentAfter`
|
||||
* `format.noIndentTags`
|
||||
* `format.forceIndentationForTags`
|
||||
* `profile.allowCompactBoolean`
|
||||
* `css.fuzzySearchMinScore`
|
||||
|
||||
The format for the `filter.commentAfter` preference is different and simpler in Emmet 2.0.
|
||||
|
||||
|
|
@ -332,7 +335,7 @@ Emmet is just one of the great web developer features in VS Code. Read on to fi
|
|||
* [HTML](/docs/languages/html.md) - VS Code supports HTML with IntelliSense, closing tags, and formatting.
|
||||
* [CSS](/docs/languages/css.md) - We offer rich support for CSS, SCSS and Less.
|
||||
|
||||
## Common questions
|
||||
## Troubleshooting
|
||||
|
||||
### Custom tags do not get expanded in the suggestion list
|
||||
|
||||
|
|
@ -344,11 +347,20 @@ Add the following setting to enable expanding of Emmet abbreviations using tab w
|
|||
"emmet.triggerExpansionOnTab": true
|
||||
```
|
||||
|
||||
### My HTML snippets ending with `+` do not work?
|
||||
### My HTML snippets ending with `+` do not work
|
||||
|
||||
HTML snippets ending with `+` like `select+` and `ul+` from the [Emmet cheatsheet](https://docs.emmet.io/cheat-sheet/) are not supported. This is a known issue in Emmet 2.0 [Issue: emmetio/html-matcher#1](https://github.com/emmetio/html-matcher/issues/1). Workaround is to create your own [custom Emmet snippets](/docs/editor/emmet.md#using-custom-emmet-snippets) for such scenarios.
|
||||
HTML snippets ending with `+` like `select+` and `ul+` from the [Emmet cheatsheet](https://docs.emmet.io/cheat-sheet/) are not supported. This is a known issue in Emmet 2.0 [Issue: emmetio/html-matcher#1](https://github.com/emmetio/html-matcher/issues/1). A workaround is to create your own [custom Emmet snippets](/docs/editor/emmet.md#using-custom-emmet-snippets) for such scenarios.
|
||||
|
||||
### Where can I set all the preferences as documented in [Emmet preferences](https://docs.emmet.io/customization/preferences/)
|
||||
### Abbreviations are failing to expand
|
||||
|
||||
First, check if you're using custom snippets (if there is a `snippets.json` file being picked up by the `emmet.extensionsPath` setting). The format of custom snippets changed in VS Code release 1.53. Instead of using `|` to indicate where the cursor position is, use tokens such as `${1}`, `${2}`, etc. instead. The [default CSS snippets file](https://github.com/emmetio/emmet/blob/master/snippets/css.json) from the `emmetio/emmet` repository shows examples of the new cursor position format.
|
||||
|
||||
If abbreviations are still failing to expand:
|
||||
|
||||
* Check the [builtin extensions](/docs/editor/extension-marketplace.md#extensions-view-filters) to see if Emmet has been disabled.
|
||||
* Try restarting the extension host by running the **Developer: Restert Extension Host** (`workbench.action.restartExtensionHost`) command in the [Command Palette](/docs/getstarted/userinterface.md#command-palette).
|
||||
|
||||
### Where can I set all the preferences as documented in [Emmet preferences](https://docs.emmet.io/customization/preferences/)?
|
||||
|
||||
You can set the preferences using the setting `emmet.preferences`. Only a subset of the preferences that are documented in [Emmet preferences](https://docs.emmet.io/customization/preferences/) can be customized. Please read the preferences section under [Emmet configuration](/docs/editor/emmet.md#emmet-configuration).
|
||||
|
||||
|
|
@ -356,6 +368,6 @@ You can set the preferences using the setting `emmet.preferences`. Only a subset
|
|||
|
||||
Of course!
|
||||
|
||||
- In CSS abbreviations, when you use `:`, the left part is used to fuzzy match with the CSS property name and the right part is used to match with CSS property value. Take full advantage of this by using abbreviations like `pos:f`, `trf:rx`, `fw:b`, etc.
|
||||
- Explore all other Emmet features as documented in [Emmet Actions](https://docs.emmet.io/actions/).
|
||||
- Don't hesitate to create your own [custom Emmet snippets](/docs/editor/emmet.md#using-custom-emmet-snippets).
|
||||
* In CSS abbreviations, when you use `:`, the left part is used to fuzzy match with the CSS property name and the right part is used to match with CSS property value. Take full advantage of this by using abbreviations like `pos:f`, `trf:rx`, `fw:b`, etc.
|
||||
* Explore all other Emmet features as documented in [Emmet Actions](https://docs.emmet.io/actions/).
|
||||
* Don't hesitate to create your own [custom Emmet snippets](/docs/editor/emmet.md#using-custom-emmet-snippets).
|
||||
|
|
|
|||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:0ce2bc51a1e16c0e3bbad3a094a8f05ff334798db5810130ad10f5ef3f39d025
|
||||
size 40735
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:4fecede4e318c319f2184ee14958f403681345750becc377187352bb45f14b2a
|
||||
size 39968
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:df0b1ee99b983ba529a79b8c3dc5e65031399311a75d5c4cdec24a7c77cfb401
|
||||
size 90933
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:75210a8ce53aaf6e7f1fb738edf786483695fc1941d3b022d55c3f34b7a4270c
|
||||
size 41543
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:aedad1dac427e4cfb8f25b0a2a890d73fe29ef40b8003ecee5e64df1be332b94
|
||||
size 374453
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:07898991d2de087a8e96e3dcd08d22e88c3fec914e7c7532af467743bf1824f2
|
||||
size 72815
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 10
|
||||
Order: 11
|
||||
Area: editor
|
||||
TOCTitle: Integrated Terminal
|
||||
ContentId: 7B4DC928-2414-4FC7-9C76-E4A13D6675FE
|
||||
|
|
@ -56,11 +56,11 @@ Unsplit a split terminal by triggering the **Terminal: Unsplit Terminal** comman
|
|||
|
||||
Change the terminal's name, icon, and tab color via the right-click context menu or by triggering the following commands:
|
||||
|
||||
Command|Command ID
|
||||
---|---|
|
||||
Terminal: Rename | `workbench.action.terminal.rename` |
|
||||
Terminal: Change Icon | `workbench.action.terminal.changeIcon` |
|
||||
Terminal: Change Color | `workbench.action.terminal.changeColor` |
|
||||
| Command | Command ID |
|
||||
| ---------------------- | --------------------------------------- |
|
||||
| Terminal: Rename | `workbench.action.terminal.rename` |
|
||||
| Terminal: Change Icon | `workbench.action.terminal.changeIcon` |
|
||||
| Terminal: Change Color | `workbench.action.terminal.changeColor` |
|
||||
|
||||
>**Tip:** Go back to the old version by setting `terminal.integrated.tabs.enabled:false`
|
||||
|
||||
|
|
@ -70,6 +70,26 @@ Terminal: Change Color | `workbench.action.terminal.changeColor` |
|
|||
|
||||
Terminal profiles are platform-specific shell configurations comprised of an executable path, arguments, and other customizations.
|
||||
|
||||
Example profile:
|
||||
|
||||
```json
|
||||
{
|
||||
"terminal.integrated.profiles.windows": {
|
||||
"My PowerShell": {
|
||||
"path": "pwsh.exe"
|
||||
"args": [
|
||||
"-noexit",
|
||||
"-file",
|
||||
"${env:APPDATA}\PowerShell\my-init-script.ps1"
|
||||
]
|
||||
}
|
||||
},
|
||||
"terminal.integrated.defaultProfile.windows": "My PowerShell"
|
||||
}
|
||||
```
|
||||
|
||||
You can use variables in terminal profiles as shown in the example above with the `APPDATA` environment variable. You can find a list of available variables in the [Variables Reference](/docs/editor/variables-reference.md) topic.
|
||||
|
||||
Configure your default integrated terminal by running the **Terminal: Select Default Profile** command, which is also accessible via the terminal dropdown.
|
||||
|
||||
|
||||
|
|
@ -556,3 +576,11 @@ Unfortunately some issues cannot be automatically detected, if you experience is
|
|||
"terminal.integrated.gpuAcceleration": "off"
|
||||
}
|
||||
```
|
||||
|
||||
### Git Bash isn't saving history when I close the terminal
|
||||
|
||||
This is a [limitation of Git Bash](https://github.com/microsoft/vscode/issues/85831#issuecomment-943403803) when using VS Code uses bash.exe (the shell) as opposed to git-bash.exe (the terminal). You can workaround this by adding the following to your `~/.bashrc` or `~/.bash-profile`:
|
||||
|
||||
```bash
|
||||
export PROMPT_COMMAND='history -a'
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 17
|
||||
Order: 18
|
||||
Area: editor
|
||||
TOCTitle: Multi-root Workspaces
|
||||
ContentId: 8d55f6b8-977f-4c26-a888-f3d8d982dd2d
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@ MetaDescription: Refactoring source code in Visual Studio Code.
|
|||
|
||||
For example, a common refactoring used to avoid duplicating code (a maintenance headache) is the [Extract Method](https://refactoring.com/catalog/extractMethod.html) refactoring, where you select source code that you'd like to reuse elsewhere and pull it out into its own shared method.
|
||||
|
||||
Refactorings are provided by a language service and VS Code has built-in support for TypeScript and JavaScript refactoring through the [TypeScript](https://www.typescriptlang.org/) language service. Refactoring support for other programming languages is provided through VS Code [extensions](/docs/editor/extension-marketplace.md) which contribute language services. The UI and commands for refactoring are the same across languages, and in this topic we'll demonstrate refactoring support with the TypeScript language service.
|
||||
Refactorings are provided by a language service and VS Code has built-in support for TypeScript and JavaScript refactoring through the [TypeScript](https://www.typescriptlang.org/) language service. Refactoring support for other programming languages is provided through VS Code [extensions](/docs/editor/extension-marketplace.md) that contribute language services. The UI and commands for refactoring are the same across languages, and in this topic we'll demonstrate refactoring support with the TypeScript language service.
|
||||
|
||||
## Code Actions = Quick Fixes and refactorings
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 12
|
||||
Order: 13
|
||||
Area: editor
|
||||
TOCTitle: Settings Sync
|
||||
ContentId: 6cb84e60-6d90-4137-83f6-bdab3438b8f5
|
||||
|
|
@ -156,6 +156,34 @@ If the keychain throws the error "No such interface "org.freedesktop.Secret.Coll
|
|||
|
||||
If the error is "Writing login information to the keychain failed with error 'Unknown or unsupported transport “disabled” for address “disabled:”'", check that `dbus-launch` has been started by following the instructions in [issue #120392](https://github.com/microsoft/vscode/issues/120392#issuecomment-814210643).
|
||||
|
||||
If the error is "Writing login information to the keychain failed with error 'Cannot create an item in a locked collection'.", you need to:
|
||||
|
||||
1. Add the following lines to your `~/.xinitrc`:
|
||||
|
||||
```sh
|
||||
# see https://unix.stackexchange.com/a/295652/332452
|
||||
source /etc/X11/xinit/xinitrc.d/50-systemd-user.sh
|
||||
|
||||
# see https://wiki.archlinux.org/title/GNOME/Keyring#xinitrc
|
||||
eval $(/usr/bin/gnome-keyring-daemon --start)
|
||||
export SSH_AUTH_SOCK
|
||||
|
||||
# see https://github.com/NixOS/nixpkgs/issues/14966#issuecomment-520083836
|
||||
mkdir -p "$HOME"/.local/share/keyrings
|
||||
```
|
||||
|
||||
2. Login again.
|
||||
|
||||
3. Have the following programs installed (installation assumes arch/pacman, should be similar to other distros):
|
||||
|
||||
```sh
|
||||
sudo pacman -S gnome-keyring libsecret libgnome-keyring
|
||||
```
|
||||
|
||||
4. Launch `seahorse`, unlock the default password keyring or create a new one, and keep it unlocked.
|
||||
|
||||
5. Restart the login procedure.
|
||||
|
||||
## Can I share settings between VS Code Stable and Insiders?
|
||||
|
||||
Yes. Please refer to the [Syncing Stable versus Insiders](#syncing-stable-versus-insiders) section for more information.
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 11
|
||||
Order: 12
|
||||
Area: editor
|
||||
TOCTitle: Tasks
|
||||
ContentId: F5EA1A52-1EF2-4127-ABA6-6CEF5447C608
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 13
|
||||
Order: 14
|
||||
Area: editor
|
||||
TOCTitle: Snippets
|
||||
ContentId: 79CD9B45-97FF-48B1-8DD5-2555F56206A6
|
||||
|
|
|
|||
|
|
@ -53,9 +53,9 @@ You can also find indicators of the **status of your repository** in the bottom-
|
|||
|
||||
|
||||
|
||||
You can type a commit message above the changes and press `kbstyle(Ctrl+Enter)` (macOS: `kbstyle(⌘+Enter)`) to commit them. If there are any staged changes, only changes will be committed. Otherwise, you'll get a prompt asking you to select what changes you'd like to commit and get the option to change your commit settings.
|
||||
You can type a commit message above the changes and press `kbstyle(Ctrl+Enter)` (macOS: `kbstyle(⌘+Enter)`) to commit them. If there are any staged changes, only those changes will be committed. Otherwise, you'll get a prompt asking you to select what changes you'd like to commit and get the option to change your commit settings.
|
||||
|
||||
We've found this to be a great workflow. For example, in the earlier screenshot, only the staged changes to `gulpfile.js` will be included in the commit. A consecutive commit action could commit later changes to `gulpfile.js`, the deletion of `yarn.lock`, and changes to `tests.js` in a separate commit.
|
||||
We've found this to be a great workflow. For example, in the earlier screenshot, only the staged changes to `overview.png` will be included in the commit. Later staging and commit actions could include the changes to `versioncontrol.md` and the two other `.png` images as a separate commit.
|
||||
|
||||
More specific **Commit** actions can be found in the **Views and More Actions** `...` menu on the top of the Source Control view.
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,169 @@
|
|||
---
|
||||
Order: 10
|
||||
Area: editor
|
||||
TOCTitle: VS Code for the Web
|
||||
ContentId: d665a790-1da1-4f45-bc0f-c09822528e55
|
||||
PageTitle: Visual Studio Code for the Web
|
||||
DateApproved: 10/20/2021
|
||||
MetaDescription: Visual Studio Code for the Web and the vscode.dev URL
|
||||
---
|
||||
# Visual Studio Code for the Web
|
||||
|
||||
Visual Studio Code for the Web provides a free, zero-install Microsoft Visual Studio Code experience running entirely in your browser, allowing you to quickly and safely browse source code repositories and make lightweight code changes. To get started, go to **[https://vscode.dev](https://vscode.dev)** in your browser.
|
||||
|
||||
VS Code for the Web has many of the features of VS Code desktop that you love, including search and syntax highlighting while browsing and editing, along with extension support to work on your codebase and make simpler edits. In addition to opening repositories, forks, and pull requests from source control providers like GitHub and Azure Repos (in preview), you can also work with code that is stored on your local machine.
|
||||
|
||||
VS Code for the Web runs entirely in your web browser, so there are certain limitations compared to the desktop experience, which you can read more about [below](#current-limitations).
|
||||
|
||||
## Relationship to VS Code desktop
|
||||
|
||||
VS Code for the Web provides a browser-based experience for navigating files and repositories and committing lightweight code changes. However, if you need access to a runtime to run, build, or debug your code, or you want to use platform features such as a terminal, we recommend moving your work to the desktop application or [GitHub Codespaces](https://github.com/features/codespaces) for the full capabilities of VS Code. In addition, VS Code desktop lets you run extensions that aren't supported in the web version, and use a full set of keyboard shortcuts not limited by your browser.
|
||||
|
||||
When you're ready to switch, you'll be able to ["upgrade"](#continue-working-in-a-different-environment) to the full VS Code desktop experience with a few clicks.
|
||||
|
||||
You can also switch between the Stable and Insiders versions of VS Code for the Web by selecting the gear icon, then **Switch to Insiders Version...**, or by navigating directly to [https://insiders.vscode.dev](https://insiders.vscode.dev).
|
||||
|
||||
## Opening a project
|
||||
|
||||
By navigating to [https://vscode.dev](https://vscode.dev), you can create a new local file or project, work on an existing local project, or access source code repositories hosted elsewhere, such as on GitHub and Azure Repos (part of Azure DevOps).
|
||||
|
||||
You can navigate to a project repository directly from a URL, following the scheme: `https://vscode.dev/SOURCE/ORG/REPO`. Using the [VS Code repo](https://github.com/microsoft/vscode) as an example, this would look like: `https://vscode.dev/github/microsoft/vscode`.
|
||||
|
||||
To work with both GitHub and Azure Repos, VS Code for the Web supports two routes, `vscode.dev/github` and `vscode.dev/azurerepos`:
|
||||
|
||||
GitHub: `https://vscode.dev/github/organization/repo`
|
||||
|
||||
Azure Repos: `https://vscode.dev/azurerepos/organization/project/repo`
|
||||
|
||||
If you're already in VS Code for the Web at [https://vscode.dev](https://vscode.dev), you can alternatively navigate to different repos via the [GitHub Repositories](https://marketplace.visualstudio.com/items?itemName=GitHub.remotehub) extension commands. Select the remote indicator in the lower left of the Status bar, and you'll be presented with the **Open Remote Repository...** command.
|
||||
|
||||
|
||||
|
||||
GitHub Repositories is the core component that provides the ability to remotely browse and edit a repository from within the editor.
|
||||
|
||||
Rather than cloning your work, GitHub Repositories creates a virtual file system to access repositories and pull requests, allowing you to become productive quickly without needing to pull code onto your local machine. You can learn more about the extension in our [GitHub Repositories](/docs/editor/github.md#github-repositories-extension) guide.
|
||||
|
||||
>**Note**: The GitHub Repositories extension works in VS Code desktop as well to provide fast repository browsing and editing.
|
||||
|
||||
You can create a new file in the web just as you would in a desktop VS Code environment, using **File** > **New File** from the Command Palette (`kbstyle(F1)`).
|
||||
|
||||
## Azure Repos (preview)
|
||||
|
||||
Support for Azure Repos (part of Azure DevOps) in Visual Studio Code for the Web is in preview, and the experience will continue to grow and evolve over time.
|
||||
|
||||
When you navigate to a URL with the schema `https://vscode.dev/azurerepos/organization/project/repo`, you will be able to read and search the files in the repo. You can fetch, pull, and sync changes, and view branches.
|
||||
|
||||
You can open any repository, branch, or tag from Azure Repos in VS Code for the Web by prefixing `vscode.dev` to the Azure Repos URL.
|
||||
|
||||
### Current limitations
|
||||
|
||||
Azure Repos support is currently read-only. Commit, branch, fork, and PR actions are disabled in the Source Control view and Command Palette.
|
||||
|
||||
## More custom URLs
|
||||
|
||||
Like in the desktop, you can customize VS Code for the Web through a rich ecosystem of extensions that support just about every back end, language, and service. Unlike in the desktop, it's easy for us to deliver customized experiences with pre-installed extensions through unique `vscode.dev` URLs (like `vscode.dev/github` and `vscode.dev/azurerepos` described above).
|
||||
|
||||
### Themes
|
||||
|
||||
You can share and experience color themes through VS Code for the Web through the URL scheme: `https://vscode.dev/theme/extensionId`.
|
||||
|
||||
For instance, you can go to [https://vscode.dev/theme/sdras.night-owl](https://vscode.dev/theme/sdras.night-owl) to experience the [Night Owl theme](https://marketplace.visualstudio.com/items?itemName=sdras.night-owl) without having to go through the download and install process.
|
||||
|
||||
> Note: The color theme URL scheme works for themes that are fully declarative (no code).
|
||||
|
||||
An extension can define multiple themes. You can use the schema `/theme/extensionId/themeName`. If no `themeName` is specified, VS Code for the Web will take the first theme.
|
||||
|
||||
As a theme author, you can add the following badge to your extension readme to allow users to easily try out your theme in VS Code for the Web (replacing `<extensionId>` with your theme extension's unique identifier):
|
||||
|
||||
```markdown
|
||||
[](https://vscode.dev/theme/<extensionId>)
|
||||
```
|
||||
|
||||
### Visual Studio Live Share
|
||||
|
||||
[Live Share](https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare) guest sessions are available in the browser through the `https://vscode.dev/liveshare` URL. The `sessionId` will be passed to the extension to make joining a seamless experience.
|
||||
|
||||
## Continue working in a different environment
|
||||
|
||||
In some cases, you will want to access a different environment that has the ability to run code. You can switch to working on a repository in a development environment that has support for a local file system and full language and development tooling.
|
||||
|
||||
The GitHub Repositories extension makes it easy for you to clone the repository locally with the **GitHub Repositories: Continue Working on...** command available from the Command Palette (`kbstyle(F1)`) or by clicking on the Remote indicator in the Status bar.
|
||||
|
||||
## Safe exploration
|
||||
|
||||
VS Code for the Web runs entirely in your web browser's sandbox and offers a very limited execution environment.
|
||||
|
||||
When accessing code from remote repositories, the web editor doesn't "clone" the repo, but instead loads the code by invoking the services' APIs directly from your browser; this further reduces the attack surface when cloning untrusted repositories.
|
||||
|
||||
When working with local files, VS Code for the Web loads them through your browser's file system access APIs, which limit the scope of what the browser can access.
|
||||
|
||||
## Saving and sharing work
|
||||
|
||||
When working on a local file in the web, your work is saved automatically if you have [Auto Save](/docs/editor/codebasics.md#saveauto-save) enabled. You can also save manually as you do when working in desktop VS Code (for example **File** > **Save**).
|
||||
|
||||
When working on a remote repository, your work is saved in the browser's local storage until you commit it. If you open a repo or pull request using GitHub Repositories, you can push your changes in the Source Control view to persist any new work.
|
||||
|
||||
## Run anywhere
|
||||
|
||||
Similar to [GitHub Codespaces](/docs/remote/codespaces.md), VS Code for the Web can run on tablets, like iPads.
|
||||
|
||||
## Language support
|
||||
|
||||
Language support is a bit more nuanced on the web, including code editing, navigation, and browsing. The desktop experiences are typically powered by language services and compilers that expect a file system, runtime, and compute environment. In the browser, these experiences are powered by language services running in the browser that provide source code tokenization and syntax colorization, completions, and many single-file operations.
|
||||
|
||||
Generally, experiences fall into the following categories:
|
||||
|
||||
* **Good:** For most programming languages, VS Code for the Web gives you code syntax colorization, text-based completions, and bracket pair colorization. Using a [Tree-sitter](https://tree-sitter.github.io/tree-sitter) syntax tree through the [anycode extension](https://marketplace.visualstudio.com/items?itemName=ms-vscode.anycode), we're able to provide additional experiences such as **Outline/Go to Symbol** and **Symbol Search** for popular languages such as C/C++, C#, Java, PHP, Rust, and Go.
|
||||
* **Better:** The TypeScript, JavaScript, and Python experiences are all powered by language services that run natively in the browser. With these programming languages, you'll get the "**Good**" experience plus rich single file completions, semantic highlighting, syntax errors, and more.
|
||||
* **Best:** For many "webby" languages, such as JSON, HTML, CSS, and LESS, etc., the coding experience in vscode.dev is nearly identical to the desktop (including Markdown preview!).
|
||||
|
||||
You can determine the level of language support in your current file through the Language Status Indicator in the Status bar:
|
||||
|
||||
|
||||
|
||||
## Limitations
|
||||
|
||||
Since VS Code for the Web runs completely within the browser, some experiences will naturally be more constrained when compared to what you can do in the desktop app. For example, the terminal and debugger are not available, which makes sense since you can't compile, run, and debug a Rust or Go application within the browser sandbox.
|
||||
|
||||
### Extensions
|
||||
|
||||
Only a subset of extensions can run in the browser. Those that cannot be installed will have a warning icon and **Learn Why** link in the Extensions view. We expect more extensions to become enabled over time.
|
||||
|
||||
|
||||
|
||||
When an Extension Pack contains extensions that do not run in the browser sandbox, you will get an informational message with the option to see the extensions included in the pack.
|
||||
|
||||
|
||||
|
||||
When extensions are executed in the browser sandbox, they are more restricted. Extensions that are purely declarative, such as most themes, snippets, or grammars, can run unmodified and are available in VS Code for the Web without any modification from the extension authors. Extensions that are running code need to be updated to support running in the browser sandbox. You can read more about what is involved to support extensions in the browser in the [web extension authors guide](/api/extension-guides/web-extensions.md).
|
||||
|
||||
There are also extensions that run in the browser with partial support only. A good example is a language extension that [restricts its support](/docs/nodejs/working-with-javascript.md#partial-intellisense-mode) to single files or the currently opened files.
|
||||
|
||||
### File system API
|
||||
|
||||
Edge and Chrome today support the [File System API](https://developer.mozilla.org/docs/Web/API/File_System_Access_API), allowing web pages to access the local file system. If your browser does not support the File System API, you cannot open a folder locally, but you can open files instead.
|
||||
|
||||
### Opening new tabs and windows
|
||||
|
||||
In certain cases, you may need to open a new tab or window while working in VS Code for the Web. VS Code might ask you for permission to access the clipboard when reading from it. Depending on your browser, you may grant access to the clipboard or otherwise allow for pop-up windows in different ways:
|
||||
|
||||
* Chrome, Edge, Firefox: Search for "site permissions" in your browser's settings, or look for the following option in the address bar on the right:
|
||||
|
||||
|
||||
|
||||
* Safari: In the Safari browser, go to **Preferences...** > **Websites** > **Pop-up Windows** > `vscode.dev` (or `insiders.vscode.dev` for the Insiders version), and select **Allow** from the dropdown.
|
||||
|
||||
### Keybindings
|
||||
|
||||
Certain keybindings may also work differently in the web.
|
||||
|
||||
| Issue | Reason |
|
||||
|-|-|
|
||||
| `kbstyle(Ctrl+Shift+P)` won't launch the Command Palette in Firefox. | `kbstyle(Ctrl+Shift+P)` is reserved in Firefox. <br> As a workaround, use `kbstyle(F1)` to launch the Command Palette. |
|
||||
| `kbstyle(Ctrl+N)` for new file doesn't work in web. | `kbstyle(Ctrl+N)` opens a new window instead. <br> As a workaround, you can use `kbstyle(Ctrl+Alt+N)`. |
|
||||
| `kbstyle(Ctrl+W)` for closing an editor doesn't work in web. | `kbstyle(Ctrl+W)` closes the current tab in browsers. <br> As a workaround, you can use `kbstyle(Ctrl+Shift+Alt+N)`. |
|
||||
| `kbstyle(Ctrl+Shift+B)` will not toggle the favorites bar in the browser. | VS Code for the Web overrides this and redirects to the "Build" menu in the Command Palette. |
|
||||
|
||||
### Mobile support
|
||||
|
||||
You can use VS Code for the Web on mobile devices, but smaller screens may have certain limitations.
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
Order: 16
|
||||
Order: 17
|
||||
Area: editor
|
||||
TOCTitle: Workspace Trust
|
||||
ContentId: 51280c26-f78b-4f9c-997f-8350bd6ed07f
|
||||
|
|
|
|||
|
|
@ -41,6 +41,16 @@ You can search for themes in the Extensions view (`kb(workbench.view.extensions)
|
|||
|
||||
|
||||
|
||||
## Auto switch based on OS color scheme
|
||||
|
||||
Windows and macOS support light and dark color schemes. There is a setting, `window.autoDetectColorScheme`, that instructs VS Code to listen to changes to the OS's color scheme and switch to a matching theme accordingly.
|
||||
|
||||
To customize the themes that are used when a color scheme changes, you can set the preferred light, dark, and high contrast themes with the settings:
|
||||
|
||||
* `workbench.preferredLightColorTheme` - defaults to "Default Light+"
|
||||
* `workbench.preferredDarkColorTheme` - defaults to "Default Dark+"
|
||||
* `workbench.preferredHighContrastColorTheme` - defaults to "Default High Contrast"
|
||||
|
||||
## Customizing a Color Theme
|
||||
|
||||
### Workbench colors
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ The best way of exploring VS Code hands-on is to open the **Get Started** page.
|
|||
|
||||
Pick a **Walkthrough** for a self-guided tour through the setup steps, features, and deeper customizations that VS Code offers. As you discover and learn, the walkthroughs track your progress.
|
||||
|
||||
If you are looking to improve your code editing skills open the **Interactive Editor playground**. Try out VS Code's [code editing features](/docs/editor/codebasics.md), like multi-cursor editing, [IntelliSense](docs/editor/intellisense.md), Snippets, [Emmet](docs/editor/emmet.md), and many more. **Help** > **Interactive Editor Playground**.
|
||||
If you are looking to improve your code editing skills open the **Interactive Editor Playground**. Try out VS Code's [code editing features](/docs/editor/codebasics.md), like multi-cursor editing, [IntelliSense](docs/editor/intellisense.md), Snippets, [Emmet](docs/editor/emmet.md), and many more. **Help** > **Editor Playground**.
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: introvideos
|
|||
TOCTitle: Code Editing
|
||||
ContentId: 826efeef-6803-49bd-a500-06c6c42cda19
|
||||
PageTitle: Edit and run code in Visual Studio Code
|
||||
DateApproved: 1/12/2021
|
||||
DateApproved: 10/12/2021
|
||||
MetaDescription: Learn the basics of editing and running code in VS Code.
|
||||
MetaSocialImage:
|
||||
---
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: introvideos
|
|||
TOCTitle: Customize
|
||||
ContentId: 3e36b1fa-cefc-4a07-9773-e672da5881a2
|
||||
PageTitle: Customize Visual Studio Code with settings and keyboard shortcuts
|
||||
DateApproved: 4/8/2021
|
||||
DateApproved: 10/11/2021
|
||||
MetaDescription: Learn how to customize your Visual Studio Code with settings and keyboard shortcuts.
|
||||
MetaSocialImage: images/opengraph/introvideos.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: introvideos
|
|||
TOCTitle: Debugging
|
||||
ContentId: cf275b3d-c1d8-4a55-b2eb-a8a744882b6a
|
||||
PageTitle: Introduction to Debugging in Visual Studio Code
|
||||
DateApproved: 4/5/2021
|
||||
DateApproved: 10/8/2021
|
||||
MetaDescription: Debugging is a core feature of Visual Studio Code. Learn how to configure and use the Node.js debugger in this introductory video.
|
||||
MetaSocialImage: images/opengraph/introvideos.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: introvideos
|
|||
TOCTitle: Productivity
|
||||
ContentId: 9b79fbb2-f7d1-4b54-a4ad-e5ccb0ebd891
|
||||
PageTitle: Visual Studio Code productivity tips
|
||||
DateApproved: 7/27/2021
|
||||
DateApproved: 10/11/2021
|
||||
MetaDescription: Become a Visual Studio Code power user with these productivity tips.
|
||||
MetaSocialImage: images/opengraph/introvideos.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: introvideos
|
|||
TOCTitle: Version Control
|
||||
ContentId: 2447F8EB-15F1-4279-B621-126C7B8EBF4B
|
||||
PageTitle: Version control in Visual Studio Code
|
||||
DateApproved: 1/20/2021
|
||||
DateApproved: 10/11/2021
|
||||
MetaDescription: Learn how to use Git version control basics in Visual Studio Code.
|
||||
MetaSocialImage: images/opengraph/introvideos.png
|
||||
---
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@ Thanks to the great Java community around VS Code, you can search for a large nu
|
|||
|
||||
To help set up Java on VS Code, there is the Microsoft [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack), which contains these popular extensions:
|
||||
|
||||
1. [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
1. [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
2. [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug)
|
||||
3. [Java Test Runner](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-test)
|
||||
4. [Maven for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-maven)
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ MetaSocialImage:
|
|||
|
||||
# Running and debugging Java
|
||||
|
||||
Visual Studio Code allows you to debug Java applications through the [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extension. It's a lightweight Java debugger based on [Java Debug Server](https://github.com/microsoft/java-debug), which extends the [Language Support for Java by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java).
|
||||
Visual Studio Code allows you to debug Java applications through the [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extension. It's a lightweight Java debugger based on [Java Debug Server](https://github.com/microsoft/java-debug), which extends the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java).
|
||||
|
||||
Here's a list of supported debugging features:
|
||||
|
||||
|
|
@ -36,7 +36,7 @@ If you run into any issues when using the features below, you can contact us by
|
|||
|
||||
## Install
|
||||
|
||||
For the debugger to work, you also need to have the [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension installed. To make it easier, there is an [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack), which bundles the [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java), the [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) and several other popular Java [extensions](/docs/java/extensions.md).
|
||||
For the debugger to work, you also need to have the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension installed. To make it easier, there is an [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack), which bundles the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java), the [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) and several other popular Java [extensions](/docs/java/extensions.md).
|
||||
|
||||
You can manually install the extension pack from the Extensions view (`kb(workbench.view.extensions)`) by typing `vscode-java-pack` in the search box. You will also be prompted to install the Extension Pack for Java when you edit a Java file in VS Code for the first time.
|
||||
|
||||
|
|
@ -200,7 +200,7 @@ There are many options and settings available to configure the debugger. For exa
|
|||
<source src="/docs/java/java-debugging/cwd-env.mp4" type="video/mp4">
|
||||
</video>
|
||||
|
||||
Consult the documentation for the [Language Support for Java by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension for help with setting up your project.
|
||||
Consult the documentation for the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) extension for help with setting up your project.
|
||||
|
||||
For many commonly used setups, there are samples available in [VS Code Java Debugger Configuration](https://github.com/microsoft/vscode-java-debug/blob/main/Configuration.md). The document explains how the Java debugger automatically generates configurations for you, and if you need to modify them, how to do so with Main class, different arguments, environment, attaching to other Java processes, and usage of more advanced features.
|
||||
|
||||
|
|
|
|||
|
|
@ -131,7 +131,7 @@ For more details about refactoring and code actions, see [Refactoring and Source
|
|||
|
||||
### IntelliSense
|
||||
|
||||
Code completion in Visual Studio Code for Java is provided by [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java). The extension is powered by the same [Java development tools (JDT)](https://www.eclipse.org/jdt/) behind Eclipse, so you can expect the same level of support.
|
||||
Code completion in Visual Studio Code for Java is provided by [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java). The extension is powered by the same [Java development tools (JDT)](https://www.eclipse.org/jdt/) behind Eclipse, so you can expect the same level of support.
|
||||
|
||||
In addition, there's also AI-assisted IntelliSense called [IntelliCode](https://visualstudio.microsoft.com/services/intellicode/). It saves you time by putting what you're most likely to use at the top of your completion list. IntelliCode recommendations are based on thousands of open-source projects on GitHub each with over 100 stars, so it's trained on the most common usages from high quality projects. When combined with the context of your code, the completion list is tailored to promote those practices. Here's IntelliCode for Java in action.
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ MetaDescription: Formatting, linting, and code analysis for Java in Visual Studi
|
|||
---
|
||||
# Java formatting and linting
|
||||
|
||||
[Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) also provides [formatting settings](https://github.com/redhat-developer/vscode-java/wiki/Formatter-settings). You can export an Eclipse formatter file and then use it for your project in VS Code.
|
||||
[Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) also provides [formatting settings](https://github.com/redhat-developer/vscode-java/wiki/Formatter-settings). You can export an Eclipse formatter file and then use it for your project in VS Code.
|
||||
|
||||
In addition, there are also the [Checkstyle for Java](https://marketplace.visualstudio.com/items?itemName=shengchen.vscode-checkstyle) and [SonarLint](https://marketplace.visualstudio.com/items?itemName=SonarSource.sonarlint-vscode) extensions, which provide features for live linting and code analysis.
|
||||
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ The extension supports the following test frameworks:
|
|||
|
||||
> Note: JUnit 3 styled tests are not supported in this extension (for example, `extends junit.framework.TestCase`).
|
||||
|
||||
The [Java Test Runner](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-test) works with the [Language Support for Java by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) and [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extensions to provide the following features:
|
||||
The [Java Test Runner](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-test) works with the [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) and [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) extensions to provide the following features:
|
||||
|
||||
- Run/Debug test cases
|
||||
- Customize test configurations
|
||||
|
|
@ -40,7 +40,7 @@ If you run into any issues when using the features below, you can contact us by
|
|||
|
||||
- JDK (version 11 or later)
|
||||
- VS Code (version 1.59.0 or later)
|
||||
- [Language Support for Java by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
- [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
- [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug)
|
||||
|
||||
## Features
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ To help you set up quickly, you can install the **Coding Pack for Java**, which
|
|||
|
||||
If you are an existing VS Code user, you can also add Java support by installing the [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack), which includes these extensions:
|
||||
|
||||
* [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
* [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
* [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug)
|
||||
* [Java Test Runner](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-test)
|
||||
* [Maven for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-maven)
|
||||
|
|
@ -49,7 +49,7 @@ You can also install extensions separately. The **Extension Guide** is provided
|
|||
|
||||
For this tutorial, the only required extensions are:
|
||||
|
||||
* [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
* [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
* [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug)
|
||||
|
||||
## Settings for the JDK
|
||||
|
|
@ -74,9 +74,12 @@ If you prefer, you can configure JDK settings using the VS Code Settings editor
|
|||
|
||||
If you need to install a JDK, we recommend you to consider installing from one of these sources:
|
||||
|
||||
* [Amazon Corretto](https://aws.amazon.com/corretto)
|
||||
* [Eclipse Adoptium's Temurin](https://adoptium.net/)
|
||||
* [Microsoft Build of OpenJDK](https://www.microsoft.com/openjdk)
|
||||
* [Oracle Java SE](https://www.oracle.com/java/technologies/javase-downloads.html)
|
||||
* [AdoptOpenJDK](https://adoptopenjdk.net/)
|
||||
* [Azul Zulu for Azure - Enterprise Edition](https://www.azul.com/downloads/azure-only/zulu/)
|
||||
* [Red Hat build of OpenJDK](https://developers.redhat.com/products/openjdk/download)
|
||||
* [SapMachine](https://sapmachine.io)
|
||||
|
||||
## Creating a source code file
|
||||
|
||||
|
|
|
|||
|
|
@ -105,11 +105,9 @@ Now paste in this source code:
|
|||
```cpp
|
||||
#include <iostream>
|
||||
|
||||
using namespace std;
|
||||
|
||||
int main()
|
||||
{
|
||||
cout << "Hello World" << endl;
|
||||
std::cout << "Hello World" << std::endl;
|
||||
}
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:1cd2b8056786a8e7a15c953c4887d0e46a8856e10c720a9150eb176f24a88c91
|
||||
size 21415
|
||||
oid sha256:b54e32cec9e302ccfdb47c06a32367e482ee3ddbc7734dbae5c7db903ebdf38b
|
||||
size 50070
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
version https://git-lfs.github.com/spec/v1
|
||||
oid sha256:5568f91f090bf9e2b9b291ed550ff7bc1b54a0adb725380e5e1ec8c8552c491c
|
||||
size 30631
|
||||
oid sha256:9a2949c6fc6ff0f4e0cf536e3272d7f46ffe7d3792bfc309fce651252b59fd36
|
||||
size 71707
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ To help you set up quickly, we recommend you use the **Coding Pack for Java**, w
|
|||
|
||||
If you have already installed VS Code and want to add Java support to it, we recommend to use the [Extension Pack for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-pack), a collection of extensions suggested by Microsoft:
|
||||
|
||||
1. [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
1. [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
|
||||
2. [Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug)
|
||||
3. [Java Test Runner](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-test)
|
||||
4. [Maven for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-maven)
|
||||
|
|
@ -107,7 +107,7 @@ A "multi-root workspace" can refer to multiple folders (directories) from dispar
|
|||
|
||||
In contrast to IDEs such as IntelliJ IDEA, NetBeans, or Eclipse, the concept of a "Java project" is provided entirely by extensions, and is not a core concept in the base VS Code. When working with "Java projects" in VS Code, you must have the necessary extensions installed to work with those project files.
|
||||
|
||||
For example, Maven, Eclipse, and Gradle Java projects are supported through [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java), by utilizing [M2Eclipse](https://www.eclipse.org/m2e/), which provides Maven support, and [Buildship](https://github.com/eclipse/buildship), which provides Gradle support through the [Eclipse JDT Language Server](https://github.com/eclipse/eclipse.jdt.ls).
|
||||
For example, Maven, Eclipse, and Gradle Java projects are supported through [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java), by utilizing [M2Eclipse](https://www.eclipse.org/m2e/), which provides Maven support, and [Buildship](https://github.com/eclipse/buildship), which provides Gradle support through the [Eclipse JDT Language Server](https://github.com/eclipse/eclipse.jdt.ls).
|
||||
|
||||
With [Maven for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-maven), you can generate projects from [Maven Archetypes](https://maven.apache.org/guides/introduction/introduction-to-archetypes.html), browse through all the Maven projects within your workspace, and execute Maven goals easily from an embedded explorer. Projects can also be created and managed with the [Project Manager for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-dependency) extension.
|
||||
|
||||
|
|
@ -133,7 +133,7 @@ One of the key advantages of VS Code is speed. When you open your Java source fi
|
|||
|
||||
### Code Completion
|
||||
|
||||
[IntelliSense](/docs/editor/intellisense.md) is a general term for language features, including intelligent code completion (in-context method and variable suggestions) across all your files and for both built-in and third-party modules. VS Code supports code completion and IntelliSense for Java through [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java). It also provides AI-assisted IntelliSense called [IntelliCode](https://visualstudio.microsoft.com/services/intellicode/) by putting what you're most likely to use at the top of your completion list.
|
||||
[IntelliSense](/docs/editor/intellisense.md) is a general term for language features, including intelligent code completion (in-context method and variable suggestions) across all your files and for both built-in and third-party modules. VS Code supports code completion and IntelliSense for Java through [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java). It also provides AI-assisted IntelliSense called [IntelliCode](https://visualstudio.microsoft.com/services/intellicode/) by putting what you're most likely to use at the top of your completion list.
|
||||
|
||||
<video autoplay loop muted playsinline controls>
|
||||
<source src="/docs/languages/java/intellisense.mp4" type="video/mp4">
|
||||
|
|
@ -143,7 +143,7 @@ For more details, see [Java Code Navigation and Editing](/docs/java/java-editing
|
|||
|
||||
## Debugging
|
||||
|
||||
[Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) is a lightweight Java Debugger based on [Java Debug Server](https://github.com/microsoft/java-debug). It works with [Language Support for Java(TM) by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) to allow users to debug Java code within Visual Studio Code.
|
||||
[Debugger for Java](https://marketplace.visualstudio.com/items?itemName=vscjava.vscode-java-debug) is a lightweight Java Debugger based on [Java Debug Server](https://github.com/microsoft/java-debug). It works with [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java) to allow users to debug Java code within Visual Studio Code.
|
||||
|
||||
Starting a debugging session is easy: click on the **Run|Debug** button available at the CodeLens of your `main()` function, or press `kb(workbench.action.debug.start)`. The debugger will automatically generate the proper configuration for you.
|
||||
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Area: languages
|
|||
TOCTitle: Python
|
||||
ContentId: c2cb770d-571d-4edf-9eb9-b5b8977c21a0
|
||||
PageTitle: Python in Visual Studio Code
|
||||
DateApproved: 9/1/2021
|
||||
DateApproved: 10/8/2021
|
||||
MetaDescription: Learn about Visual Studio Code as a Python IDE (code completion, debugging, linting).
|
||||
---
|
||||
# Python in Visual Studio Code
|
||||
|
|
|
|||
|
|
@ -72,7 +72,6 @@ T-SQL snippets provide code templates for commonly used T-SQL statements. Type "
|
|||
* [SQL Server documentation]
|
||||
* [SQL Server on Linux documentation]
|
||||
* [SQL Server Blog]
|
||||
* [SQL Server Videos] on Channel9
|
||||
|
||||
[Transact-SQL]: https://docs.microsoft.com/sql/t-sql/language-reference
|
||||
[mssql]: https://aka.ms/mssql-marketplace
|
||||
|
|
@ -82,6 +81,5 @@ T-SQL snippets provide code templates for commonly used T-SQL statements. Type "
|
|||
[SQL Server documentation]: https://docs.microsoft.com/sql/sql-server/sql-server-technical-documentation
|
||||
[SQL Server on Linux documentation]: https://docs.microsoft.com/sql/linux/
|
||||
[SQL Server Blog]: https://blogs.technet.microsoft.com/dataplatforminsider/
|
||||
[SQL Server Videos]: https://channel9.msdn.com/Tags/sql+server
|
||||
[GitHub]: https://github.com/microsoft/vscode-mssql
|
||||
[GitHub Issue Tracker]: https://github.com/microsoft/vscode-mssql/issues
|
||||
|
|
|
|||
|
|
@ -229,7 +229,7 @@ In this tutorial, we used the `create-react-app` generator to create a simple Re
|
|||
|
||||
### VS Code React Sample
|
||||
|
||||
This is a [sample](https://github.com/microsoft/vscode-react-sample) React application used for a [demo](https://channel9.msdn.com/Events/Build/2016/B887) at the 2016 //Build conference. The sample creates a simple TODO application and includes the source code for a Node.js [Express](https://expressjs.com/) server. It also shows how to use the [Babel](https://babeljs.io) ES6 transpiler and then use [webpack](https://webpack.js.org/) to bundle the site assets.
|
||||
This is a [sample](https://github.com/microsoft/vscode-react-sample) React application, which creates a simple TODO application and includes the source code for a Node.js [Express](https://expressjs.com/) server. It also shows how to use the [Babel](https://babeljs.io) ES6 transpiler and then use [webpack](https://webpack.js.org/) to bundle the site assets.
|
||||
|
||||
### TypeScript React
|
||||
|
||||
|
|
|
|||
|
|
@ -315,7 +315,7 @@ VS Code tries to provide project-wide IntelliSense for JavaScript and TypeScript
|
|||
|
||||
This can happen in a few instances:
|
||||
|
||||
- You are working with JavaScript or TypeScript code on [github.dev](https://docs.github.com/codespaces/developing-in-codespaces/web-based-editor) and VS Code is running in the browser.
|
||||
- You are working with JavaScript or TypeScript code on [vscode.dev](https://vscode.dev) or [github.dev](https://docs.github.com/codespaces/developing-in-codespaces/web-based-editor) and VS Code is running in the browser.
|
||||
- You open a file from a virtual file system (such as when using the [GitHub Repositories](https://marketplace.visualstudio.com/items?itemName=GitHub.remotehub) extension).
|
||||
- The project is currently loading. Once loading completes, you will start getting project-wide IntelliSense for it.
|
||||
|
||||
|
|
@ -336,7 +336,7 @@ Here's an incomplete list of features that are either disabled or have more limi
|
|||
- Renaming is disabled.
|
||||
- Many refactorings are disabled.
|
||||
|
||||
Some additional features are disabled on `github.dev`:
|
||||
Some additional features are disabled on `vscode.dev` and `github.dev`:
|
||||
|
||||
- [Automatic type acquisition](/docs/nodejs/working-with-javascript.md#typings-and-automatic-type-acquisition) is currently not supported.
|
||||
|
||||
|
|
|
|||
Некоторые файлы не были показаны из-за слишком большого количества измененных файлов Показать больше
Загрузка…
Ссылка в новой задаче