How do I get TypeScript incremental compilation (tsc -w) working on VSCode when using WSL?

Question

I'm attempting to learn TypeScript, and I learned about the watch feature (tsc -w). I'm on a windows machine, and I usually prefer using VSCode and Windows Subsystem for Linux (WSL). I know it's an odd setup, but it's usually made easy by using the WSL extension on VSCode.

My issue is as follows:

• tsc watch works on WSL when I use VIM or any other installed Linux editor to edit my typescript file
• when using any windows editor (VSCode, notepad, etc,) to write to my typescript file, tsc watch doesn't pick up on the change
• even if I run tsc watch through a WSL connection on VSCode, it won't pick up any changes

I admit I have no idea how tsc watch is implemented, but I'm not sure why it wouldn't pick up changes made to files only when modified through Windows editors. Typescript transpiles properly and even displays errors properly no matter where I first run the 'tsc -w' command, but it won't pick up on the changes unless they are saved through ubuntu editors. If anyone has ideas about why this may be happening, please let me know.

Answer 1

I found the solution after playing around with the watchOptions in tsconfig.json.

The default arguments for watchFile and watchDirectory is "usefsevents" which uses the documentation describes as "(the default): Attempt to use the operating system/file system’s native events for file changes". Changing these argument values to "dynamicPriorityPolling", "fixedPollingInterval", or "priorityPollingInterval" solves my problem. The other options use the file system's native events to listen for changes in the project directory or the files listed in tsconfig.json. If you're running tsc -w in WSL, but editing the files in Windows editors, linux's native event listeners won't tell tsc about the file changes, thus I am using one of the polling options instead.

Example of my solution:

Documentation Used:

• https://www.typescriptlang.org/docs/handbook/configuring-watch.html
• https://www.typescriptlang.org/tsconfig#watch-watchFile
• https://www.typescriptlang.org/tsconfig#watchDirectory