Angular Proxy Generation in Modular Monolith Not Respecting Module Structure #9172

5 Answer(s)

• 

  0

  sumeyye.kurtulus created one month ago

  Support Team Angular Expert

  Hello Gabriel,

  Thank you for your patience and for reaching out.

  What’s the correct way to generate Angular proxies inside module folders?

  To ensure proxies are generated in the correct module folder, you can use the Angular-specific proxy generation command with these flags and parameters:

  abp generate-proxy -t ng -m <module-name> -u <api-definition-url> --target <angular-project-name>
  

  For further details on Angular proxy generation via the ABP CLI, you can refer to the official documentation: ABP CLI - Generate Proxy. Let us know if you still face issues with the proxy generation.

  Is there any official documentation on using Angular in a modular monolith setup?

  The official documentation for Angular integration in a modular monolith is currently being updated. It will be available the upcoming release.

  Save Cancel
• 

  0

  alva.gabriel created one month ago

  Hi sumeyye.kurtulus,

  Thank you for your response. I was finally able to generate the Angular proxies inside the correct module folder by running the command you shared from within the Angular folder of the corresponding module (in this case, /modules/modularcrm.products/angular/). That resolved the proxy generation issue—thank you!

  Now I’ve encountered a different problem. I’m following the ABP guide for the Modular Monolith Application template (ModularCrm), and while the proxy for the Products module is being generated correctly, I’m running into an issue with how imports are handled in the IDE.

  For example, when I auto-import ProductService, the IDE generates:

   { ProductService } from '@proxy';
  

  This used to work fine in a previous project based on ABP version 8. However, in this setup, I get the following compile-time error:

  ../modules/modularcrm.products/angular/projects/products/src/lib/components/products.component.ts:2:32 - error TS2307: Cannot find module '@proxy' or its corresponding type declarations.
  

  If I manually change the import to:

   { ProductService } from '../proxy';
  

  the application compiles and works as expected.

  Is this the expected behavior in the new modular structure?

  Do I have to manually adjust the import path for each service or DTO I need to use? Or is there a configuration I might be missing to make the @proxy alias resolve correctly in this context?

  Thanks again for the support!

  Kind regards, Gabriel

  Save Cancel
• 

  0

  sumeyye.kurtulus created one month ago

  Support Team Angular Expert

  Hello again! Thanks for reaching out and continuing to explore the modular setup.

  The issue you're encountering is related to the paths configuration in your tsconfig.json. In recent ABP modular monolith setups, alias resolution—like @proxy—depends entirely on how these paths are configured.

  Could you please share the relevant portion of the paths property from your tsconfig.json (or tsconfig.base.json, if you're using a workspace configuration)? This will help us verify if the alias is correctly mapped to the generated proxy folder.

  Looking forward to your response—thanks for your continued collaboration!

  Save Cancel
• 

  0

  alva.gabriel created 25 days ago

  Hi sumeyye.kurtulus,

  Thanks again for the follow-up!

  Here’s a detailed update on the tsconfig.json configurations:

  • In the main Angular project (ModularCrm, Single Layer Application based on the ABP tutorial), the tsconfig.json contains the following path mappings:

  "paths": {
    "@proxy": ["src/app/proxy/index.ts"],
    "@proxy/*": ["src/app/proxy/*"],
    ...
    "@modularcrm/products": [
      "../modules/modularcrm.products/angular/projects/products/src/public-api.ts"
    ],
    "@modularcrm/products/config": [
      "../modules/modularcrm.products/angular/projects/products/config/src/public-api.ts"
    ],
    ...
  }
  

  • In the module-specific Angular project (ModularCrm.Products), the tsconfig.json includes:

  "paths": {
    "@modular-crm/products": [
      "projects/products/src/public-api.ts"
    ],
    "@modular-crm/products/config": [
      "projects/products/config/src/public-api.ts"
    ],
    "@proxy": ["projects/products/src/lib/proxy/index.ts"],
    "@proxy/*": ["projects/products/src/lib/proxy/*"]
  }
  

  As you can see, in the module-specific tsconfig.json, the @proxy alias points correctly to the generated proxies (projects/products/src/lib/proxy/index.ts), and the files are correctly placed there. That’s why I find it a bit strange that the compilation fails with:

  ../modules/modularcrm.products/angular/projects/products/src/lib/components/products.component.ts:2:32 - error TS2307: Cannot find module '@proxy' or its corresponding type declarations.
  

  Even though the structure and the tsconfig.json configuration seem correct. When I manually change the import to a relative path like:

  tsCopiarEditarimport { ProductService } from '../proxy';
  

  everything compiles and runs properly.

  Is there perhaps an additional step I’m missing to make the @proxy alias work inside the module's Angular project?

  Or should I be configuring something else (maybe in angular.json or the project references)? Thank you once again for your continued help—I really appreciate the support while working through this modular setup!

  Kind regards, Gabriel

  Save Cancel
• 

  0

  sumeyye.kurtulus created 20 days ago

  Support Team Angular Expert

  Hello again Gabriel,

  We are sorry for getting back to you this late.

  I see that the config in the main ts.config.json file seems wrong. You will need to change the path reference like this:

   //for angular/tsconfig.json
   "@proxy": ["../modularcrm.products/angular/projects/products/src/lib/proxy/index.ts"],
   "@proxy/*": ["../modularcrm.products/angular/projects/products/src/lib/proxy/*"]
   
   //for modularcrm.products/angular/tsconfig.json
   "@proxy": ["projects/products/src/lib/proxy/index.ts"],
   "@proxy/*": ["projects/products/src/lib/proxy/*"]
  

  I also want to remind that we have slightly updated this part in the latest version of the ABP Studio. The documentation will also be updated soon. However, I can also send you a sample project if you prefer.

  Thank you for your cooperation. Let us know if you need further assistance on that.

  Save Cancel