Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Help with Setup for Typescript Azure Functions #77

Closed
panmona opened this issue Jun 30, 2021 · 4 comments
Closed

Help with Setup for Typescript Azure Functions #77

panmona opened this issue Jun 30, 2021 · 4 comments

Comments

@panmona
Copy link

panmona commented Jun 30, 2021

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
Copy link
Owner

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
Copy link
Author

panmona commented Jul 7, 2021

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
Copy link
Owner

@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
Copy link
Author

panmona commented Jul 8, 2021

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!

@panmona panmona closed this as completed Jul 8, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants