Skip to content

Debugging Language Service in VS Code

Arthur Ozga edited this page Sep 23, 2016 · 20 revisions

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.1 The server side code lives in src/services of the TypeScript repo.

We will use a stable version of vscode to debug a development version of vs code running against a development version of tsserver.

  1. Download/install a stable version of vs code.

  2. Follow the instructions to setup a development version of vs code.1

  3. Clone the typescript repo locally, and follow the instructions on building typescript.

  4. Update your user settings 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"
}

From here, there are different steps for debugging the client- and server-side, respectively.

Debugging client-side

Note: the gulp-build doesn't currently produce working source-maps, and building with jake may require some extra effort to fix the source-maps.

  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):

a. In a shell, export the TSS_DEBUG environment variable to an open port (you will run the development vs code instance from within that shell).

b. Edit extensions/typescript/src/typescriptServiceClient.ts, setting the port to an open one.

  1. Update launch.json with an option to attach to the node instance, with sourcemaps from your built/local folder. You can use this option as a template:
		{
			"name": "Attach to TS Server",
			"type": "node",
			"request": "attach",
			"port": 5859,
			"sourceMaps": true,
			"outDir": "/path/to/repo/TypeScript/built/local"
		},
  1. Launch an instance of development vs code, and open a ts file.

  2. Launch an instance of stable vs code.

  3. Attach the stable vs code instance to the development instance.

Debugging server-side

  1. Launch an instance of development vs code.

  2. Launch an instance of stable vs code.

  3. Attach the stable vs code instance to the development instance.


1 In particular, the built-in extension spawns the node instance that loads tsserver via the call to electron.fork() in extensions/typescript/src/typescriptServiceClient.ts.

2 If you are on Linux, be sure to increase the number of file watchers per the fix for ENOSPC errors. for opening medium-large projects like Typescript, the default limit of 8192 is almost certainly too small.

Clone this wiki locally