Gmail Chrome 扩展模板项目教程

Gmail Chrome 扩展模板项目教程

gmail-chrome-extension-boilerplateHello world chrome extension using gmail.js项目地址:https://gitcode.com/gh_mirrors/gm/gmail-chrome-extension-boilerplate

1. 项目的目录结构及介绍

gmail-chrome-extension-boilerplate/
├── LICENSE.md
├── README.md
├── content.js
├── gmail.js
├── jquery-1.10.2.min.js
├── main.js
└── manifest.json

• LICENSE.md: 项目的许可证文件，通常包含项目的开源许可证信息。
• README.md: 项目的说明文件，通常包含项目的简介、安装和使用说明。
• content.js: 内容脚本文件，用于在网页中注入JavaScript代码。
• gmail.js: 专门用于与Gmail交互的JavaScript文件。
• jquery-1.10.2.min.js: jQuery库文件，用于简化JavaScript代码的编写。
• main.js: 主JavaScript文件，通常包含扩展的主要逻辑。
• manifest.json: Chrome扩展的配置文件，定义了扩展的基本信息、权限、内容脚本等。

2. 项目的启动文件介绍

manifest.json

manifest.json 是Chrome扩展的配置文件，定义了扩展的基本信息、权限、内容脚本等。以下是该文件的主要内容：

{
  "name": "Gmail.js",
  "version": "0.1",
  "description": "Hello World Gmail chrome extension",
  "content_scripts": [
    {
      "matches": ["https://mail.google.com/*"],
      "js": ["content.js"]
    }
  ],
  "web_accessible_resources": [
    "jquery-1.10.2.min.js",
    "gmail.js",
    "main.js"
  ],
  "manifest_version": 2
}

• name: 扩展的名称，这里是 Gmail.js。
• version: 扩展的版本号，这里是 0.1。
• description: 扩展的描述，这里是 Hello World Gmail chrome extension。
• content_scripts: 定义了内容脚本，指定在哪些网页中注入JavaScript代码。这里是在 https://mail.google.com/* 页面中注入 content.js。
• web_accessible_resources: 定义了可以在网页中访问的资源文件，包括 jquery-1.10.2.min.js、gmail.js 和 main.js。
• manifest_version: 指定Manifest文件的版本，这里是 2。

3. 项目的配置文件介绍

manifest.json

manifest.json 是Chrome扩展的核心配置文件，包含了扩展的所有配置信息。以下是该文件的主要配置项：

• name: 扩展的名称，用于在Chrome扩展管理页面中显示。
• version: 扩展的版本号，用于版本管理和更新。
• description: 扩展的描述，用于描述扩展的功能和用途。
• content_scripts: 定义了内容脚本，指定在哪些网页中注入JavaScript代码。
• web_accessible_resources: 定义了可以在网页中访问的资源文件。
• manifest_version: 指定Manifest文件的版本，目前推荐使用 2。

通过以上配置，开发者可以定义扩展的基本信息、权限、内容脚本等，从而实现扩展的功能。

gmail-chrome-extension-boilerplateHello world chrome extension using gmail.js项目地址:https://gitcode.com/gh_mirrors/gm/gmail-chrome-extension-boilerplate