How to configure Symfony UX (Twig & Live Components) in a DDD / Modular project structure

[johnkhansrc]

Hello 👋

I'm currently trying to integrate Symfony UX (especially Twig and Live Components) into a project that follows a DDD-inspired modular architecture, where each Bounded Context is isolated.

Despite several attempts, I'm struggling to configure twig and twig_component so that Symfony can properly resolve the link between components (PHP classes) and their templates, especially for Live Components.

Here’s a simplified version of my project structure:

src/
├── BoundedContextA/
│   ├── Application/
│   ├── Domain/
│   ├── Infrastructure/
│   └── Presentation/
│       └── Web/
│           ├── Controller/
│           ├── Component/
│           │   └── ComponentA.php
│           └── Template/
│               └── components/
│                   └── ComponentA.html.twig
├── BoundedContextB/
│   └── ... (same structure)

In ComponentA.php, I declare the component like this:

#[AsLiveComponent(name: 'context_a.component_a', template: '@context_a/components/ComponentA.html.twig')]
final class ComponentA

And in my twig.yaml, I’ve added:

twig:
    paths:
        '%kernel.project_dir%/src/BoundedContextA/Presentation/Web/Template/components': context_a

However, when I render the component via {{ component('context_a.component_a') }}, Symfony throws an error saying that the template is bound to an AnonymousComponent, as if it couldn't match the class with the template.

I've also confirmed the component is registered with the correct tag (live_component) and appears correctly in debug:twig-component.

❓ My question:

What is the correct way to configure Twig paths and UX component discovery in such a modular (DDD-like) structure, so that:

The link between template and component class is correctly resolved

No "AnonymousComponent" fallback is triggered

The structure remains isolated per Bounded Context (for maintainability)

Thank you very much in advance 🙏
Any guidance or best practices from the Symfony UX team or the community would be greatly appreciated!

[johnkhansrc]

Here is the solution I found :

Declare the template path in twig config and use twig namespace in twig_component config

twig_component:
    anonymous_template_directory: 'components/'
    defaults:
        App\BoundedContextX\Presentation\Web\Component\:
            name_prefix: 'BoundedContextX'
            template_directory: '@BoundedContextXComponentTemplates'
        App\BoundedContextY\Presentation\Web\Component\:
            name_prefix: 'BoundedContextY'
            template_directory: '@BoundedContextXComponentTemplates'
        App\_Shared\Presentation\Web\Component\:
            name_prefix: '_SharedComponent'
            template_directory: '@SharedComponentTemplates'

twig:
    file_name_pattern: '*.twig'
    paths:
        '%kernel.project_dir%/src/_Shared/Presentation/Web/Template': Shared
        '%kernel.project_dir%/src/_Shared/Presentation/Web/Component': SharedComponentTemplates
        '%kernel.project_dir%/src/BoundedContextX/Presentation/Web/Template': BoundedContextX
        '%kernel.project_dir%/src/BoundedContextX/Presentation/Web/Component': BoundedContextXComponentTemplates
        '%kernel.project_dir%/src/BoundedContextY/Presentation/Web/Template': BoundedContextY
        '%kernel.project_dir%/src/BoundedContextY/Presentation/Web/Component': BoundedContextYComponentTemplates

⚠️ Do not pass any parameter to the component decorator!