推荐使用symfony/ux-react或symfony/ux-vue官方集成方案，它自动处理组件注册、热更新、Twig桥接等关键环节；手动配置Webpack易导致挂载失败、热更新失焦、路径错误、CSRF失效及登录态丢失等问题。
直接集成 React 或 Vue 到 Symfony 项目里，不是“能不能”，而是“走哪条路”——选错路径，轻则热更新失效、props 传不进去，重则 CSRF 失效、登录态丢失、生产环境白屏。核心判断：用 symfony/ux-react 或 symfony/ux-vue（推荐），别手写 Webpack 配置或手动挂载。
用 symfony/ux-* 而不是从零配 Encore
UX 包是 Symfony 官方维护的“胶水层”，它自动处理组件注册、入口注入、热更新监听和 Twig 渲染桥接。手写 webpack.config.js 启用 enableReactPreset() 或 enableVueLoader() 看似自由，实则容易漏掉关键项：
-
enableSingleRuntimeChunk()没开 → React/Vue 运行时被拆到异步 chunk，document.getElementById()找不到挂载点，报Cannot read property 'appendChild' of null - 没配
splitEntryChunks()→ 多个组件共用同一 entry，修改 A 组件触发 B 组件重编译，热更新失焦 - 没设
setPublicPath('/build')→encore_entry_script_tags()输出的路径错乱，HTML 里加载 404 的 JS
Twig 中传参必须用 json_encode|raw，且只传必要字段
别在 Twig 里拼 <script>window.props = {...}</script>，也别用 asset() 引一个带 query string 的 JS。正确姿势是：
- 后端控制器中构造精简数组：
$props = ['user' => ['id' => $user->getId(), 'roles' => $user->getRoles()]] - Twig 模板里安全输出：
<script>window.INITIAL_PROPS = {{ props|json_encode|raw }};</script> - 前端入口（如
app.tsx）直接读：const props = window.INITIAL_PROPS;，不 fetch，不 decode
漏掉 |raw 会转义引号导致 JSON 解析失败；传了 user.passwordHash 或 user.token 是典型 XSS 风险。
Orderly React SDK 钩子使用参考指南，包括 useOrderEntry、usePositionStream、useOrderbookStream、useCollateral 等。
立即学习“前端免费学习笔记（深入）”；
API 请求必须带 credentials: 'include'，且后端要配 cookie_samesite
开发时 Vue/React 在 localhost:5173，Symfony 在 localhost:8000，跨域下 Cookie 默认不发送。现象是：登录成功但后续请求 401，Set-Cookie 被浏览器静默丢弃。
- 前端 fetch 必须显式加：
fetch('/api/posts', { credentials: 'include' }) - Symfony 配置
framework.session.cookie_samesite: 'lax'（开发可用），生产环境若需跨域登录，必须设为'none'且启用 HTTPS - 别只依赖 Axios 的
withCredentials: true—— 如果baseURL是相对路径（如/api），请求仍发给前端端口，根本没走到 Symfony
CSRF 和权限不能只靠前端控制
Vue 里写 v-if="user.roles.includes('ROLE_ADMIN')" 只是体验优化；React 里用 useSelector(state => state.auth.roles) 也不代表后端没校验。真实防线在 Symfony：
- 所有敏感 API 路由必须加注解：
@IsGranted('ROLE_EDITOR')或->isGranted('ROLE_EDITOR') - 表单提交必须带
_token字段，由csrf_token('form')生成，前端通过fetch的body提交，不是塞进 URL - JWT 认证场景下，前端存 token 到
localStorage是方便，但泄露风险高；更稳的是后端设HttpOnlyCookie，前端只管发请求
最容易被忽略的点：开发时关了 Twig 缓存但忘了关 Encore 的 enableVersioning()，导致 public/build 下文件名不变，浏览器缓存旧 JS —— 改了代码却看不到效果，以为是框架问题。
