[TwigComponents] Classes not found(Pimcore)

[Michael Bremmer]

Hi, I have installed Symfony UX Components and Flex has created the twig_component.yaml for me as described in the documentation. I created a few components with the Maker Bundle and it created all Template and PHP class files correctly.
Using Components in template is rendering them correctly.

But running debug:twig-component I see that all my Components are of type "Anon" as the class is not found.

Can anyone help me, what am I missing?

+---------------------------+-------+--- Components ---------------------------------+------+
| Name                      | Class | Template                                       | Type |
+---------------------------+-------+------------------------------------------------+------+
| Button                    |       | components/Button.html.twig                    | Anon |
| PrintContentElement       |       | components/PrintContentElement.html.twig       | Anon |
| Alert                     |       | components/Alert.html.twig                     | Anon |
| PrintContentElementLayout |       | components/PrintContentElementLayout.html.twig | Anon |

config/packages/twig_component.yaml:

twig_component:
    anonymous_template_directory: 'components/'
    defaults:
        # Namespace & directory for components
        App\Twig\Components\: 'components/'

src/Twig/Components/Button.php:

<?php

namespace App\Twig\Components;

use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;

#[AsTwigComponent]
final class Button
{
}

templates/components/Button.html.twig

<div{{ attributes.defaults({class: 'button'}) }}>
    {% block content %}{% endblock %}
</div>

[Simon André]

If you add some properties in your class ?

[Michael Bremmer]

Wow, thanks for the super quick feedback!

That's how I first encountered the problem, I wanted to use properties and they just couldn't be found.
Even if I copy the code from the documentation.

Like:

<?php

// src/Twig/Components/Alert.php
namespace App\Twig\Components;

use Symfony\UX\TwigComponent\Attribute\AsTwigComponent;

#[AsTwigComponent]
class Alert
{
    public string $type = 'success';
    public string $message;
}

<div class="alert alert-{{ type }}">
    {{ message }}
</div>

config seems to be correct:

bin/console debug:config TwigComponentBundle

Current configuration for "TwigComponentBundle"
===============================================

twig_component:
    anonymous_template_directory: components/
    defaults:
        App\Twig\Components\:
            template_directory: components/
            name_prefix: ''
    controllers_json: /var/www/html/assets/controllers.json

[Michael Bremmer]

Calling the Class in a controller is working:

<?php

namespace App\Controller;

use App\Twig\Components\Alert;

class TestController
{
    public function index(): Response
    {
        $alert = new Alert();
        dd($alert);
    }
}

[App\Twig\Components\Alert](file:///var/www/html/src/Twig/Components/Alert.php#L9) {#9293 ▼
  +type: "success"
  +message: ? string
}

[Simon André]

It's probably something obvious but i can't find it oO

Could you try to create a minimal reproducer ?

[Simon André]

Do you uses TwigComponent in recent version ?

[Michael Bremmer]

HI, I have installed v2.18.0 but the problem remains. I will try to make the problem reproducible but until then I assume that it is due to my config/app. Therefore we can close this issue for now.

Thanks for your support!

[Michael Bremmer]

can't repro

[Michael Bremmer]

Installation in a new Symfony project worked as expected.
I am using a Symfony based CMS called Pimcore. Using their skeleton docker image one can set up a working example in a sec and installing twig components will result in twig components not working.
https://github.com/pimcore/docker

I asked in the pimcore project if someone can help with the problem:
https://github.com/orgs/pimcore/discussions/17155

[Simon André]

Ok thank for the update! Hope this can be fixed for you on the PimCore side

[Michael Bremmer]

The Pimcore community was able to help me.

# config/services.yaml
services:
...
    App\Twig\Components\:
        resource: '../src/Twig/Components/*'
...