PiedPiPer Safari扩展项目启动与配置指南

1. 项目目录结构及介绍

PiedPiPer.safariextension 项目目录结构如下：

PiedPiPer.safariextension/
├── background.js              # 后台脚本文件
├── content.js                 # 内容脚本文件
├── manifest.json              # 项目配置文件
├── PiedPiPer.html             # 扩展的HTML界面
├── images/
│   ├── icon.png               # 扩展图标
│   └── ...                   # 其他资源文件
└── styles/
    ├── main.css              # 样式文件
    └── ...                  # 其他样式文件

• background.js: 后台脚本，负责处理扩展的后台逻辑，如监听浏览器事件、管理扩展的生命周期等。
• content.js: 内容脚本，用于与网页内容交互，向页面注入自定义脚本。
• manifest.json: 扩展的配置文件，定义了扩展的基本信息、权限、脚本和资源等。
• PiedPiPer.html: 扩展的用户界面，通常是扩展的弹出窗口或选项页面。
• images/: 存放扩展所需的图片资源，如图标等。
• styles/: 存放扩展的样式文件，用于定义扩展界面的样式。

2. 项目的启动文件介绍

项目的启动主要依赖于 manifest.json 文件。以下是该文件的基本内容：

{
    "manifest_version": 2,
    "name": "PiedPiPer",
    "version": "1.0",
    "description": "描述信息",
    "icons": {
        "16": "images/icon.png"
    },
    "permissions": [
        "storage",
        "activeTab"
    ],
    "background": {
        "scripts": ["background.js"],
        "persistent": false
    },
    "browser_action": {
        "default_popup": "PiedPiPer.html",
        "default_icon": {
            "16": "images/icon.png"
        }
    },
    "content_scripts": [
        {
            "matches": ["<all_urls>"],
            "js": ["content.js"]
        }
    ]
}

• manifest_version: 定义了扩展使用的manifest文件版本。
• name: 扩展的名称。
• version: 扩展的版本号。
• description: 扩展的描述信息。
• icons: 定义了扩展的图标。
• permissions: 列出了扩展所需的权限。
• background: 定义了后台脚本的路径和是否持久运行。
• browser_action: 定义了扩展的浏览器动作，如弹出窗口和图标。
• content_scripts: 定义了内容脚本的匹配规则和脚本路径。

3. 项目的配置文件介绍

manifest.json 文件是项目的核心配置文件，它定义了扩展的所有功能和权限。以下是一些关键的配置项：

• name: 扩展的显示名称。
• version: 扩展的版本号，用于版本控制和更新。
• description: 扩展的简短描述，通常用于在商店中展示。
• icons: 扩展的图标文件，可以提供不同尺寸的图标以适应不同的显示需求。
• permissions: 扩展需要使用的权限，如访问存储、操作标签页等。
• background: 后台脚本的配置，包括脚本文件路径和是否持续运行。
• browser_action: 浏览器动作的配置，定义了扩展图标和弹出窗口等行为。
• content_scripts: 内容脚本的配置，定义了脚本要注入的页面和脚本文件路径。

正确配置 manifest.json 文件是确保扩展顺利运行的关键步骤。