Safari Web Extension：popup.html中Bootstrap文件加载失败

排查步骤及解决方案 #

1. 确认资源路径与实际结构匹配 #

先核实bootstrap文件夹是否确实和popup.html处于同一层级（均在Resources目录下）。若路径没问题，尝试去掉路径开头的./，直接使用相对路径：

<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="bootstrap/js/bootstrap.bundle.min.js"></script>

2. 配置Manifest资源访问权限 #

如果使用Manifest V3，需在manifest.json中添加web_accessible_resources字段，允许Bootstrap资源被popup页面访问：

"web_accessible_resources": [
  {
    "resources": ["bootstrap/css/*", "bootstrap/js/*"],
    "matches": ["<all_urls>"]
  }
]

若是Manifest V2，确保没有限制资源访问的配置，或确认资源目录已被纳入扩展允许的资源范围。

3. 验证Xcode资源打包配置（若使用Xcode开发） #

• 打开Xcode项目，进入目标的Build Phases标签
• 检查Copy Bundle Resources列表，确认bootstrap文件夹及其内部文件已被添加
• 若未添加，点击+按钮选择对应文件/文件夹加入

4. 检查文件完整性与权限 #

• 重新下载Bootstrap文件替换原文件，排除文件损坏问题
• 确保扩展文件夹内的文件权限正常，未被系统锁定或限制访问

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