生产环境下Twig文件中Vite资产未关联问题求助

以下是针对你遇到的问题的排查和解决步骤：

1. 验证预发布环境的环境变量配置 #

你的vite.config.js中base依赖VITE_PATH_ASSET环境变量，预发布环境必须正确设置这个变量，确保它指向CDN的根路径（比如https://your-cdn-domain.com）：

• 检查预发布环境的.env文件或部署脚本，确认VITE_PATH_ASSET已正确配置，无遗漏或拼写错误。
• 构建后查看public/build/manifest.json，确认其中的资源路径包含正确的CDN前缀。

2. 配置Symfony Vite Bundle的CDN路径 #

在Symfony的config/packages/vite.yaml（或对应环境的配置文件，如config/packages/prod/vite.yaml）中添加CDN资产基础URL配置，让Twig标签能正确生成CDN路径：

vite:
  asset_base_urls:
    - '%env(VITE_PATH_ASSET)%'

3. 确认Manifest文件已部署到服务器 #

Vite生产构建生成的public/build/manifest.json必须同步到Symfony服务器（而非CDN），vite-bundle需要读取该文件生成正确的资产标签：

• 检查预发布服务器的public/build目录下是否存在manifest.json，且文件内的资源路径与CDN上的实际路径一致。
• 确保部署流程包含同步该文件的步骤，避免只上传静态资源到CDN而遗漏manifest。

4. 修正vite-plugin-symfony的生产环境配置 #

servePublic: true是开发环境的设置，生产环境需关闭以避免干扰资产解析：

symfonyPlugin({
  servePublic: false, // 生产环境设为false
  refresh: true,
  viteDevServerHostname: null,
}),

5. 确认Symfony环境模式 #

确保预发布环境的APP_ENV设置为prod，vite-bundle在非prod环境下会尝试连接开发服务器，导致资产标签不渲染：

• 查看预发布服务器的.env文件，确认APP_ENV=prod。

6. 验证Twig模板中的标签使用 #

确认模板中使用的Vite标签正确，且传入的entry名称与vite.config.js中rollupOptions.input的key完全匹配：

{{ vite_entry_script_tag('app') }}
{{ vite_entry_link_tag('app') }}

替换'app'为你实际定义的entry名称。

内容的提问来源于stack exchange，提问作者dadidoududo