Hot Reload not working when Typescript Function is in subdirectory

[panmona]

The hot reloading is not working when a Typescript function is in a subdirectory and you're using one of the following ways to start it:

func start --prefix {dir}
func start--script-root {dir}
cd {dir} && func start

Repro

I made a reproduction repository with which I can reliably reproduce this issue: https://github.com/panmau/azure-function-hot-reload-repro

• Get the function running locally
• curl http://localhost:7071/api/Test
• Observe the logged output
• Make a change, for example: Hello World to Hello Universe
• Rerun curl http://localhost:7071/api/Test
• The logging output doesn't change! The compiled js file did. The function doesn't seem to restart after the recompilation.

The repro is based on the normal configuration that you receive with:

func init
func new 

The difference is that I moved the directory of the function one level down, added one of the ways to start the function to package.json and updated the @azure/function package.

Environment

func --version
3.0.3568

OS
Manjaro Linux 21.0.7 Ornara

Let me know whether you need any more info and if you can reproduce it. I am willing to contribute the bugfix but I need some guidance in which area it could possibly be.

[anthonychu]

The functions host watches the folder in which it is started. Since the host is being started in src but the actual JS files are in dist, it doesn't see the changes and therefore doesn't restart.

However, if you changed your tsconfig to compile it to src/dist and update your function.json's script path to point to the new location, the function app should restart when you update a file and watch recompiles your file.

Here's the updated app: https://github.com/panmau/azure-function-hot-reload-repro/compare/main...anthonychu:fix-hot-reload

[panmona]

Thanks a lot for your answer, this works well for a workaround!

I'm not sure whether this is the correct solution though. I think it makes more sense for the output directory to be in the root. I feel like using the watchDirectories option in the host.json would be a better option for making this work nicely. It currently doesn't seem to handle it though. I tried with:

  "watchDirectories": [
    "../dist"
  ]

(Maybe because it doesn't like the ..?)

If you think that having the dist in src is the way to go, I feel like this should be at least better highlighted in the documentation as I couldn't find this info (The functions host watches the folder in which it is started.) while researching this.

Let me know what you think.

[ejizba]

@panmau yes the issue is with watchDirectories. It turns out the host watches the root of the app (see here) and only uses watchDirectories to filter file change events (see here). This would need to be fixed by the host - it would have to actually watch those directories instead of just use them to filter. I'm not entirely sure of the implications of that change, though. Transferring to host repo

This issue is also related to https://github.com/Azure/azure-functions-host/issues/5373 - we plan to support more complex file structures in general.