chrome插件开发入门指南

什么是扩展插件？

扩展插件是可以定制浏览体验的小型软件程序。它们使用户可以根据个人需要或偏好来定制Chrome功能和行为。它们基于Web技术（例如HTML，JavaScript和CSS）构建。

扩展必须满足狭义定义且易于理解的单一目的。一个扩展可以包含多个组件和一系列功能，只要所有内容都有助于实现共同的目标。

用户界面应最少且具有意图。它们的范围从简单的图标到覆盖整个页面。

扩展文件被压缩到.crx用户下载并安装的单个程序包中。这意味着扩展与普通的Web应用程序不同，它不依赖于Web上的内容。

扩展程序通过 Chrome开发人员信息中心分发，并发布到 Chrome网上应用店。有关更多信息，请参阅商店开发人员文档。

你好插件

通过此快速的Hello扩展示例，对扩展进行一小步。首先创建一个新目录来存储扩展的文件，或者从示例页面下载它们。

接下来，添加一个名为的文件，manifest.json 并包含以下代码：

{
  "name": "Hello Extensions",
  "description" : "Base Level Extension",
  "version": "1.0",
  "manifest_version": 2
}

每个扩展都需要一个清单，尽管大多数扩展仅对清单没有多大作用。为了快速入门，扩展程序在该browser_action字段下声明了一个弹出文件和图标：

{
  "name": "Hello Extensions",
  "description" : "Base Level Extension",
  "version": "1.0",
  "manifest_version": 2,
  "browser_action": {
    "default_popup": "hello.html",
    "default_icon": "hello_extensions.png"
  }
}

在此处下载，然后创建一个名为的文件： hello_extensions.pnghello.html

<html>
<body>
<h1>Hello Extensions</h1>
</body>
</html>

现在hello.html，单击该图标时将显示扩展名。下一步是在中包含manifest.json启用键盘快捷键的命令。此步骤很有趣，但不是必需的：

{
  "name": "Hello Extensions",
  "description" : "Base Level Extension",
  "version": "1.0",
  "manifest_version": 2,
  "browser_action": {
    "default_popup": "hello.html",
    "default_icon": "hello_extensions.png"
  },
  "commands": {
    "_execute_browser_action": {
      "suggested_key": {
        "default": "Ctrl+Shift+F",
        "mac": "MacCtrl+Shift+F"
      },
      "description": "Opens hello.html"
    }
  }

}

最后一步是在您的本地计算机上安装扩展。

chrome://extensions在浏览器中导航到。您还可以通过点击多功能框右上角的Chrome菜单，将鼠标悬停在“ 更多工具”上，然后选择扩展程序来访问此页面。
选中“ 开发人员模式 ”旁边的框。
单击“ **加载解压缩的扩展名”，**然后为“ Hello扩展名”扩展名选择目录。

恭喜你！现在，您可以通过单击hello_world.png图标或按 Ctrl+Shift+F键盘来使用基于弹出窗口的扩展名。