mirror of
https://github.com/microsoft/TypeScript.git
synced 2026-04-17 13:48:46 -05:00
Some clarifications and rephrasings.
Daniel Rosenwasser
committed by
GitHub
GitHub
parent
346955dee7
commit
aeec5948ab
@@ -1,71 +1,73 @@
|
||||
VS Code is designed around an extension model. This means that the client-side (ie: text-editor) code for communicating with the TypeScript server lives in "extensions/typescript" in the VS Code repo.<sup>1</sup>
|
||||
The server side code lives in `src/services` of the TypeScript repo.
|
||||
VS Code is designed around an extension model. TypeScript provides a server called TSServer that provides information for providing quick-info, completions, etc., and VS Code acts as a client which queries the server when this information is needed. For example, VS Code queries TSServer for quick-info when the user's mouse hovers over a variable. TSServer will respond with information such as the appropriate type, and the styling to apply to the text that describes the type.
|
||||
|
||||
We will use a stable version of vscode to debug a development version of vs code running against a development version of tsserver.
|
||||
Organizationally, the client-side code for communicating with the TypeScript server lives in [`extensions/typescript`](https://github.com/Microsoft/vscode/tree/master/extensions/typescript) in [the VS Code repository](https://github.com/Microsoft/vscode).<sup>1</sup>
|
||||
|
||||
1) Download/install a stable version of vs code.
|
||||
Meanwhile, the server-side code lives in `src/services` and `src/server` of [the TypeScript repository](https://github.com/Microsoft/TypeScript).
|
||||
|
||||
2) Follow the instructions to [setup a development version of vs code](https://github.com/Microsoft/vscode/wiki/How-to-Contribute).<sup>1</sup>
|
||||
We will use a stable version of VS Code to debug a development version of VS Code running against a development version of TSServer.
|
||||
|
||||
3) Clone the typescript repo locally, and follow the instructions on building typescript.
|
||||
1. Download/install a stable version of vs code.
|
||||
2. Follow the instructions to [setup a development version of VS Code](https://github.com/Microsoft/vscode/wiki/How-to-Contribute).<sup>2</sup>
|
||||
3. Clone the TypeScript repo locally, and follow the instructions on [building TypeScript](https://github.com/Microsoft/TypeScript#building).
|
||||
4. [Update the User Settings](https://code.visualstudio.com/docs/languages/typescript#_using-newer-typescript-versions) in the development version of VS Code, to point to the `built/local` directory of your local TypeScript repository.
|
||||
|
||||
4) [Update your user settings](https://code.visualstudio.com/docs/languages/typescript#_using-newer-typescript-versions) to use your development version of typescript, located in the `.../TypeScript/built/local` directory.
|
||||
The corresponding setting/path is
|
||||
```
|
||||
{
|
||||
"typescript.tsdk": "/path/to/repo/TypeScript/built/local"
|
||||
}
|
||||
```
|
||||
This will look something like the following:
|
||||
|
||||
```json
|
||||
{
|
||||
"typescript.tsdk": "/path/to/repo/TypeScript/built/local"
|
||||
}
|
||||
```
|
||||
|
||||
You may instead update this in the Workspace Settings for a project as well, but you will have to remember that the development version of TSServer will only be in effect within that project.
|
||||
|
||||
From here, there are different steps for debugging the client- and server-side, respectively.
|
||||
|
||||
## Debugging tsserver (server-side)
|
||||
|
||||
**Note:** [the gulp-build doesn't currently produce working source-maps](https://github.com/Microsoft/TypeScript/issues/11105), and [building with jake may require some extra effort to fix the source-maps](https://github.com/Microsoft/TypeScript/issues/11111).
|
||||
> **Note:** [the gulp-build doesn't currently produce working source-maps](https://github.com/Microsoft/TypeScript/issues/11105), and [building with jake may require some extra effort to fix the source-maps](https://github.com/Microsoft/TypeScript/issues/11111).
|
||||
|
||||
1) Set the ts-server to be open in debug mode on the right port using either of the following two methods (in the rest of this guide, we assume you chose 5859):
|
||||
1. Choose an available port to debug TSServer using either of the following two methods (in the rest of this guide, we assume you chose 5859):
|
||||
* In a shell, export the `TSS_DEBUG` environment variable to an open port. We will run the development VS Code instance from within that shell.
|
||||
|
||||
a. In a shell, [export](http://stackoverflow.com/questions/1158091/defining-a-variable-with-or-without-export) the `TSS_DEBUG` environment variable to an open port (you will run the development vs code instance from within that shell).
|
||||
For most Unix-like shells (e.g. bash), this will be something like
|
||||
|
||||
b. Edit `extensions/typescript/src/typescriptServiceClient.ts`, setting the port to an open one.
|
||||
```sh
|
||||
export TSS_DEBUG = 5859
|
||||
```
|
||||
|
||||
2) Update launch.json with an option to attach to the node instance, with sourcemaps from your `built/local` folder.
|
||||
For PowerShell, this is something like
|
||||
|
||||
Template for older VSCode:
|
||||
```
|
||||
{
|
||||
"name": "Attach to TS Server",
|
||||
"type": "node",
|
||||
"request": "attach",
|
||||
"port": 5859,
|
||||
"sourceMaps": true,
|
||||
"outDir": "/path/to/repo/TypeScript/built/local"
|
||||
},
|
||||
```
|
||||
Template Newer VSCode (trying with version 1.13.1 with node V6.10):
|
||||
```
|
||||
{
|
||||
"name": "Attach to TS Server",
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"protocol": "legacy",
|
||||
"port": 5859,
|
||||
"sourceMaps": true,
|
||||
"outFiles": ["/path/to/repo/TypeScript/built/local"],
|
||||
"runtimeArgs": [
|
||||
"--debug=5859"
|
||||
]
|
||||
}
|
||||
```
|
||||
With Node version 8.0, `protocol` should be "inspector" (see: https://github.com/Microsoft/vscode/issues/26411#issuecomment-300607077)
|
||||
```posh
|
||||
$env:TSS_DEBUG = 5859
|
||||
```
|
||||
|
||||
* Manually edit `extensions/typescript/src/typescriptServiceClient.ts` in your development-side VS Code, setting the port to an open one.
|
||||
|
||||
3) Launch an instance of development vs code, and open a ts file.
|
||||
2. Update `launch.json` with an option to attach to the node instance, with sourcemaps from your `built/local` folder.
|
||||
|
||||
4) Launch an instance of stable vs code.
|
||||
For VS Code v1.13.1+ and Node v8.0+, this will look like the following:
|
||||
|
||||
5) Attach the stable vs code instance to the development instance.
|
||||
```json
|
||||
{
|
||||
"name": "Attach to TS Server",
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"protocol": "inspector",
|
||||
"port": 5859,
|
||||
"sourceMaps": true,
|
||||
"outFiles": ["/path/to/repo/TypeScript/built/local"],
|
||||
"runtimeArgs": [
|
||||
"--debug=5859"
|
||||
]
|
||||
}
|
||||
```
|
||||
|
||||
For the same versions of Code, but older versions of Node (e.g. 6.x), you'll need to set `"protocol"` to be `"legacy"`.
|
||||
|
||||
3. Launch an instance of your development VS Code, and open a TypeScript file.
|
||||
4. Launch your stable-release version of VS Code.
|
||||
5. Attach the stable VS Code instance to the development instance.
|
||||
|
||||
## Debugging the Extension Host (client-side)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user