npm run dev in typescript project, watch is not working

[JoHuang]

🐛 Bug Report

Changed Typescript files cannot be applied.

To Reproduce

Steps to reproduce the behavior:

1. Use master branch to generate typescript project
2. npm run dev
3. change string in example.ts ( server auto restarted )
4. /example response didn't change.
5. I have to ctrl+c to terminate npm run dev, run agin to make the change applied.

Expected behavior

/example response changed according to 3.'s change.

Your Environment

• node version: 12
• fastify version: 3.0.0-rc2
• os: Mac

setup step:
#131 (comment)

[fvelcker]

I have a similar issue. I have to make a change a second time to see the first change happening. if I do a third change, I'll see th second, etc.
It happens with concurently but also with 2 shells running at the same time (one for TS the other one for fastify)

[fvelcker]

Ah well, sorry, found why... (looks like typing my message rubber ducked me).
fastify start -w was running before tsc finishes compiling because it detected the change in the .ts file.

So I added --ignore-watch='/src' as my ts files are in a src folder. So now fastify start -w --ignore-watch='/src' restarts only after the files have compiled.

Not sure it is related, but if it helps....

[alemagio]

I think this is solved in the latest version of the code.

[mcollina]

I just shipped that, please check again.

[alemagio]

There is an issue indeed.
The problem is that when there is a change on a TS file both tsc and fastify-cli restart.
But, apparently, fastify-cli is faster than tsc so it restarts before tsc has finished transpiling TS to the dist folder so the change is not loaded.
This is an hotfix:
tsc && concurrently -k -p \"[{name}]\" -n \"TypeScript,App\" -c \"yellow.bold,cyan.bold\" \"tsc -w\" \"fastify start --ignore-watch=.ts$ -w -l info -P dist/app.js\""
If no one else want to I'll push a fix on the template script.

[mcollina]

Go for that!

[alemagio]

Working hard on this.
Hope to open a PR (even a draft maybe) by the end of the week.
Just to let you know still a WIP.

[fox1t]

Ok. Just open a WIP PR and we will discuss on the best way to handle this.

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[alemagio]

the fix is described here
It is only necessary to replace the dev script in the app-ts template.

[soulchild]

@mcollina @alemagio, I am still seeing this exact problem with a freshly generated Typescript fastify-cli project (v2.10.0). Is there still work being done or was this IMHO essential feature abandoned? I have a workaround involving nodemon and ts-node instead of the default dev script using tsc and concurrently, but I'd really like this to work out-of-the-box with the standard way. Thanks!

[alemagio]

@soulchild
to fix it you can simply replace you dev script with the one described here
I thought this was merged btw so this should be out of the box. I'll check anyway.

[soulchild]

Thanks, @alemagio! I was under the impression that your solution was just a hot-fix until a more permanent solution was found. But I'm happy to just stick with it, if that is what will eventually be merged anyways. 😄

[alemagio]

I think that changing that behavior is not that simple.
The solution proposed is a patch but at least it should be included in the template I think.
I opened a PR for that.

[VIEWVIEWVIEW]

This is an hotfix:
tsc && concurrently -k -p \"[{name}]\" -n \"TypeScript,App\" -c \"yellow.bold,cyan.bold\" \"tsc -w\" \"fastify start --ignore-watch=.ts$ -w -l info -P dist/app.js\""

The --ignore-watch option does not work with multiple arguments on when using the --lang=typescript starter within the "dev"-script on windows with cmd.

In case anyone ever runs into the issue, where --ignore-watch multiple arguments break the cli, just use three backslahes & double quote " to add your exclusions. Don't use single quotes like in the README.md.

Example: You have the following directory structure:

.
├── .next
├── logs
├── dist
├── next.config.js
├── node_modules
├── package-lock.json
├── package.json
├── src
├── test
└── tsconfig.json

Changed files within the folders .next and logs should not trigger a restart.

Change the dev-script in package.json like this:

- "dev": "tsc && concurrently -k -p \"[{name}]\" -n \"TypeScript,App\" -c \"yellow.bold,cyan.bold\" \"tsc --watch\" \"fastify start --ignore-watch=.ts$ -w -l info -P dist/app.js\""
+ "dev": "tsc && concurrently -k -p \"[{name}]\" -n \"TypeScript,App\" -c \"yellow.bold,cyan.bold\" \"tsc --watch\" \"fastify start --ignore-watch=\\\".next logs .ts$\\\" -w -l info -P dist/app.js\""

Please note that single quote ' won't work within the concurrently call in cmd, and a single backslash would cause the cmd prompt to be thinking that it's the end of the concurrently-command argument.

---

In addition to that, add the to be excluded folders in the tsconfig.json like this:

"exclude": [
    "node_modules",
+    ".next",
+    "logs"
]

---

As an alternative, you could also use bash for windows (kentcdodds/cross-env#192 (comment)), create an .npmrc with script-shell = "C:\\windows\\System32\\bash.exe" as content. But at this point it would better to just switch to WSL completely and the file system would slow you down etc.

Hope this helps someone in the future :)