Typo3 12中SCSS引用PNG等资源的方法及相关疑问

TYPO3 12 已将所有扩展迁移至 vendor 目录（扩展的public文件夹不再公开），资源会被发布到站点根目录下的_assets文件夹，每个扩展对应一个哈希命名的子文件夹，示例引用方式如下：

.icon-metal-detection {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('/_assets/5f2f0b71dc3c27d2b89fdb263ae9883e/Icons/icon.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

针对你提出的疑问，解答如下：

1. 哈希文件夹名称是否会在不同环境或未来变更？ #

哈希值由扩展的资源内容、扩展版本、发布配置共同生成：

• 若扩展版本未更新、资源文件无修改、发布配置未调整，哈希值保持不变，不同环境（本地、开发、staging、生产）的哈希文件夹名称一致。
• 若扩展更新、资源文件修改（如图片、CSS内容变更）或发布配置调整，哈希会重新计算，文件夹名称随之变更。

2. 如何高效识别自己扩展对应的哈希文件夹？ #

无需逐个查找，可通过以下方式快速定位：

• 后台日志查询：进入TYPO3后台「系统」>「日志」，筛选日志类别为「资源发布」，日志条目会明确记录扩展标识（如EXT:your_extension）对应的_assets哈希路径。
• CLI命令查询：执行TYPO3命令行工具命令：

  typo3 resource:publish
  

  命令输出会列出所有已发布资源的扩展与对应哈希路径，直接找到目标扩展条目即可。
• 调试模式提取：本地开发时开启调试模式，查看页面源码中已加载的扩展资源URL（如样式、脚本的引用路径），从中提取对应的哈希值。

3. 相对路径无法生效，TYPO3自动添加../../../导致路径错误？ #

这是因为扩展资源从vendor目录的原结构被复制到_assets后，路径层级发生了变化，原相对路径不再适配新的发布位置。解决方式：

• 直接使用绝对路径引用_assets下的资源，格式如示例中的url('/_assets/[哈希]/Icons/icon.png')。
• 利用TYPO3 API动态生成资源URL，避免硬编码哈希：
  • 在Fluid模板中使用：

    <f:uri.resource path="Icons/icon.png" extensionName="YourExtensionKey" />
    

  • 在PHP代码中调用：

    use TYPO3\CMS\Core\Utility\GeneralUtility;
    use TYPO3\CMS\Core\Resource\ResourceFactory;
    
    $filePath = GeneralUtility::getFileAbsFileName('EXT:your_extension/Resources/Public/Icons/icon.png');
    $fileObject = ResourceFactory::getInstance()->getFileObjectFromLocalFile($filePath);
    $publicUrl = $fileObject->getPublicUrl();
    

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