Help with Setup for Typescript Azure Functions

[panmona]

Goal

I want to use this template for setting up a monorepo with Azure Functions but I'm struggling to get it working how I want.

Problems

• I got it working with imports that are exported from index.ts
• I got it working with imports like: package/dist/file
• I can't get it working with package/src/file or package/file style imports

I get the error:
'Error: Qualified path resolution failed - none of the candidates can be found on the disk.

According to issue Azure/azure-functions-core-tools#2 it seems that I need to use tsconfig-paths but I don't know how to do that as the azure functions core tools don't use ts-node.

Questions

• Is there an alternative to tsconfig-paths to get paths like package/src/file or package/file working? Or does tsconfig-paths also work without ts-node?
• How can I set this up so that when you start project-a you don't need to build project-b first?
• I wondered why tsconfig.json and tsconfig.build.json is split. Maybe you can explain?

I hope someone can provide me some guidance here on possible ways to proceed! (it could be that this also isn't the right place to ask this)

Repro

I have made a minimal as possible repro here on a separate branch: https://github.com/ultimate-ttt/ttt-backends/tree/dev-mono-with-berry
To get it running you need:

• Azure Function Core tools installed Installation Guide
• yarn / yarn 2
• To test whether the startup of the function works go to src/connection/ and run yarn start

If you have any problems with getting it running, I can help here.

[NiGhTTraX]

Is there an alternative to tsconfig-paths to get paths like package/src/file or package/file working? Or does tsconfig-paths also work without ts-node?

tsconfig-paths does support node, but requires some special usage.

How can I set this up so that when you start project-a you don't need to build project-b first?

This depends on how you build the project. A framework/tool that has support for tsconfig-paths will compile all monorepo dependencies when building/starting a single package. You will need to use the path aliases in the build config (see answer below as well) so that everything gets compiled in one go. All of the tool/framework examples in this repo work this way.

I wondered why tsconfig.json and tsconfig.build.json is split. Maybe you can explain?

Depending on the package, you may need to skip the path aliases during build time so that dependencies are treated as external. That's why I separated the build config from the development one (that your IDE would use). If you're publishing packages, then you most likely want to skip the aliases during the build. If, on the other hand, you're building apps/bundles you can use the aliases to compile all the dependencies.

---

For your Azure example, if you're limited to using node instead of ts-node then I would use a bundler (rollup, webpack etc.) together with tsconfig-paths to compile everything and produce a single artifact.

[panmona]

Thank you so much for that detailed answer, it was really helpful! 👍

tsconfig-paths together with webpack (as that was the easiest to setup) is working for me now.
Now import {meaningOfLife} from '@ttt/other/src/meaningOfLife' works. This also builds all of it in one go now 👍

What I'm still struggling with though is getting import { meaningOfLife } from '@ttt/other/meaningOfLife' working. I hope that you can give me some pointers for this even if it is just a different issue in this repository. I couldn't find any other issue asking for this though.

---

I still have the following type aliases set up:

"paths": {
  "@ttt/other": ["src/other/src/*"],
  "@ttt/*": ["src/*/src"],
}

But I get Cannot find module '@ttt/other/meaningOfLife' or its corresponding type declarations.
(I have pushed my newest code here: https://github.com/ultimate-ttt/ttt-backends/tree/webpack, the webpack config is here: https://github.com/ultimate-ttt/ttt-backends/blob/webpack/src/connection/webpack.config.js)

[NiGhTTraX]

@panmau you're missing the wildcard from the alias, it should be @ttt/other/*. You can check the recently updated components package for a working example.

[panmona]

That was an easy fix, I somehow didn't see that last asterix.
I will close this issue now as this is now fully solved.

Thank you so much again!