Symfony UX 是多个可插拔前端增强包集合，旨在低侵入集成 Turbo、Stimulus 等现代 JS 体验到 Symfony Twig 工作流；ux-twig-component 实现模板组件化，ux-turbo 提供无刷新导航，ux-chartjs 需 Stimulus 补全交互，且版本对齐至关重要。
Symfony UX 组件库不是“一个库”，而是多个独立、可插拔的前端增强包集合，核心目标是把现代 JavaScript 体验（Turbo、Stimulus、Chart.js 等）以低侵入方式接入 Symfony 的 PHP/Twig 工作流。它不替换 Twig，也不强制用 Webpack Encore，但会悄悄帮你桥接前后端边界。
symfony/ux-twig-component：组件化模板的最小闭环
它让 AlertComponent 这样的类直接对应到 {{ component('alert', { message: '...' }) }}，省去手动 include + 传参 + 命名空间管理的繁琐。关键点在于：
- 组件类必须带
#[AsTwigComponent('alert')]属性，名字要和component()第一个参数严格一致 - 模板路径固定为
templates/components/alert.html.twig，不能自定义位置（除非改twig.paths配置） - 属性默认全部公开，不加
public修饰符会报Cannot read property "xxx" on null - 不支持构造函数注入服务——想用 Doctrine 或 Logger？得通过
ContainerInterface手动获取，或改用控制器传递数据
symfony/ux-turbo：不用写 JS 就能获得 SPA 感
装完 symfony/ux-turbo 后，只要在链接或表单上加 data-turbo="true"（或全局启用），点击/提交就会自动变成无刷新导航。但它不是魔法：
- 后端响应必须返回完整的
<turbo-stream>片段，或标准 HTML（Turbo 会自动提取<body>内容） -
render_chart()或component()渲染的内容若含内联脚本，Turbo 默认会跳过执行——得用turbo:load事件重绑定 - 表单提交失败时，
Response::create($html)->setStatusCode(422)不会触发 Turbo 的 error 处理，得靠自定义响应头或 JS 拦截
symfony/ux-chartjs：图表逻辑仍得靠 Stimulus 控制器补全
render_chart() 只负责初始化基础图表，所有交互、格式化、动态更新都得写 Stimulus 控制器。比如加百分比标签，不能只改 PHP 数组：
- PHP 侧传入的
options是静态快照，无法响应数据变化 - 必须新建
app/controllers/percentage_controller.js，监听chartjs:connect事件，在event.detail.chart上修改options.plugins.datalabels.formatter -
data-controller="percentage"要加在<canvas>标签上，不是外层 div - Webpack Encore 必须启用
stimulus插件，否则控制器根本不会注册
真正容易被忽略的是版本对齐：Symfony 6.4+ 项目若用了 symfony/ux-twig-component 与 symfony/ux-turbo 的 v2 版本，但没升级 @symfony/stimulus-bridge 到 v4，Stimulus 控制器里的 this.element 可能是 undefined——这种错不会报红，只会静默失效。
