tsc-watch fails to restart node server on source file changes within a docker bind mount

[anthonyorona]

host platform: Ubuntu 20.04.5 LTS
container platform: node:16-alpine

run command:
"dev": "tsc-watch --noClear -p ./tsconfig.json --onSuccess "node src/index.js" --compiler ./node_modules/.bin/tsc --onFailure "echo Compilation Failed"",

bind mount configuration:
volumes:
- type: bind
source: ./my-app/src
target: /home/node/src

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "module": "ES6",
    "moduleResolution": "nodenext",
    "target": "es2016",
    "esModuleInterop": true,
    "sourceMap": true,
    "outDir": "dist",
    "strict": true,
    "skipLibCheck": true,
    "strictNullChecks": true,
    "noImplicitAny": false,
    "preserveConstEnums": true,
    "baseUrl": ".",
    "paths": {
      "*": [
        "node_modules/*"
      ]
    },
    "types": ["node"]
  },
  "include": ["./src/**/*"],
  "watchOptions": {
    // Use native file system events for files and directories
    "watchFile": "useFsEvents",
    "watchDirectory": "useFsEvents",
    // Poll files for updates more frequently when they're updated a lot.
    "fallbackPolling": "dynamicPriority",
    // Don't coalesce watch notification
    "synchronousWatchDirectory": true,
    "excludeDirectories": ["**/node_modules", "dist"]
  },
}

I am trying to use tsc-watch for hot reload during development, previously I used nodemon without issue. I migrated to TS and made configuration changes. tsc-watch is not working within the docker container. I change a .js file under source and compilation is not triggered. I am not sure if it is:

• bad configuration
• failure of file system events to be reported
• bug within tsc-watch

Please advise

[gilamran]

To narrow down the problem, can you just run it with tsc --watch without any hot reload. does it work?

[oelerpearler]

Hi @anthonyorona ! I have actually not that big of an idea how the typescript watcher works under the hood, but I had the same issue that my changes on the typescript files on a Windows Host didn't trigger any tsc-watch rebuilds inside my docker container based on the node image (weird thing though, is that it worked for me approximately a year ago, so no Idea what changed in the meantime, be it docker bind mounts, tsc --watch or tsc-watch). Probably similar to you, file changes were correctly mirrored into the docker container, but the typescript watcher just didn't get triggered.

However, even though it is probably a less CPU friendly way, things worked for me as soon as I've explicitly set the watchOptions' watchFile & watchDirectory tsconfig settings to one of the "polling" settings likes fixedpollinginterval, prioritypollinginterval etc. (https://www.typescriptlang.org/tsconfig#watch-watchFile). So e.g. following in the tsconfig file worked then:

{
  ...
  "watchOptions": {
    "watchFile": "dynamicprioritypolling",
    "watchDirectory": "dynamicprioritypolling",
    "excludeDirectories": ["**/node_modules", "dist"],
  }
}

[gilamran]

@anthonyorona Can you confirm @oelerpearler's solution?

[gilamran]

Bump before closing

[YouneLL]

the problem persists, this issue needs to be reopened, it seems like tsc-watch is not working properly with docker's container anymore

[gilamran]

@YouneLL @anthonyorona Can any of you provide an example of the failure?

[piotr-cz]

There is no failure, tsc-watch simply doesn't restart after files have changed.

[gilamran]

Can someone please provide an example?

[piotr-cz]

This is my workaround:

tsconfig.json

{
  // ...
  "watchOptions": {
    "excludeDirectories": ["**/node_modules", "dist"]
  },
}

Dockerfile

# ...
CMD npm run dev -- --watchFile dynamicPriorityPolling --watchDirectory dynamicPriorityPolling

I wasn't able to use Dockers exec form, it somehow messes up arguments

[piotr-cz]

@gilamran
I'd say that this may be reproduced for any project using tsc-watch on Docker.

Maybe synced changes don't trigger native file events within container that typescript relies on by default.

This may be also Windows host - only issue as I'm on Windows 10

Related issue: microsoft/TypeScript#54144

[gilamran]

yea, ok so the reason is probably what @piotr-cz mentioned: microsoft/TypeScript#54144
tsc-watch is relaying on tsc to do the actual watch. If it's not working for typescript it work for tsc-watch

[piotr-cz]

Since docker 2.22.0 it's possible to use docker compose watch feature without bind mounts and watchFile/ watchDirectory tsc options:

# docker-compose.yml

services:
  app:
    build: .
    command: npm run dev -- --noClear
    develop:
      watch:
        - action: sync
          path: ./src
          target: /usr/src/app/src
          ignore:
            - node_modules/
        - action: rebuild
          path: package.json
          target: /usr/src/app

command:

docker compose up --build --watch

Docs:

• https://docs.docker.com/compose/compose-file/develop/
• https://docs.docker.com/compose/file-watch/