nrwl nx - How do we add routing to an Angular library? - Stack Overflow

admin管理员组

文章数量:1289986

I'm working on a micro frontend for an app I'm building and I want it to have routing. After generating my components and creating a routes.ts file, I realized there is no app.config.ts file to bootstrap them to the library. I'm using Angular 19 with standalone components and the only info I can find on the matter is from older versions of angular using NgModule and RouterModule. I came across a github bug report from back in 2019 where someone was asking why they're not getting a prompt for if they want to add routing to their libraries upon generating and one of the maintainers had this to say:

In the current setup, prompting users to configure the router doesn't seem the most ergonomic setup. So we decided to change the prompt configuration until we have a way to provision separate defaults for angular and typescript libs.

You can read the report here. Have they figured that out yet or made a solid decision since to just not allow routing in libraries? Even at the time that person in the report didn't necessarily say we couldn't add routing anymore, they just removed the option from the prompt configuration which sounds like setting things up manually should still be an option.

The only thing I could think to try is adding the provideRouter() method to the providers array on my main component but that didn't work. Is there a way to set up routing in a library or should I not build my micro frontends as libraries if they need routing?

I'm working on a micro frontend for an app I'm building and I want it to have routing. After generating my components and creating a routes.ts file, I realized there is no app.config.ts file to bootstrap them to the library. I'm using Angular 19 with standalone components and the only info I can find on the matter is from older versions of angular using NgModule and RouterModule. I came across a github bug report from back in 2019 where someone was asking why they're not getting a prompt for if they want to add routing to their libraries upon generating and one of the maintainers had this to say:

In the current setup, prompting users to configure the router doesn't seem the most ergonomic setup. So we decided to change the prompt configuration until we have a way to provision separate defaults for angular and typescript libs.

You can read the report here. Have they figured that out yet or made a solid decision since to just not allow routing in libraries? Even at the time that person in the report didn't necessarily say we couldn't add routing anymore, they just removed the option from the prompt configuration which sounds like setting things up manually should still be an option.

The only thing I could think to try is adding the provideRouter() method to the providers array on my main component but that didn't work. Is there a way to set up routing in a library or should I not build my micro frontends as libraries if they need routing?

• angular
• nrwl-nx

Share Improve this question Follow edited Feb 20 at 21:00 Optiq asked Feb 20 at 9:28 OptiqOptiq 3,25255 gold badges4040 silver badges7979 bronze badges 3

• 3 Routing is something which you do in an app, not in a library. How exactly are you expecting Routing to work from within a library? Also it would be helpful to add a link to the related GitHub issue. – JSON Derulo Commented Feb 20 at 11:48
• I'm using a micro frontend architecture for my app and am making the micro frontends into libraries I can pull inside the main app. The micro frontends are "wizards" that take the user step by step through some process so I figured I could just use routing to take them through each step. Using *if conditions through my templates to toggle things on and off would make things a bit cumbersome so routing felt like the better solution. – Optiq Commented Feb 20 at 20:34
• @JSONDerulo I just added the link to my question as well as a quote of their exact words. I didn't add it originally because I all of a sudden couldn't find it anymore so I had to paraphrase lol. – Optiq Commented Feb 20 at 21:01

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

In the provider of app.config.ts add provideRouter() and you can pass your routes in that

routes.ts

export routes: Route[] = [...]

app.config.ts import the routes than

export const appConfig: ApplicationConfig = {
  providers: [
    provideRouter(routes)
  ]
}

本文标签： nrwl nxHow do we add routing to an Angular libraryStack Overflow