开启 Chrome 扩展程序开发之旅的新方式

在本篇博文中,我们很高兴分享 Chrome 扩展程序使用入门体验的一些重大改进,以及您可以通过哪些方式参与其中。

旧版指南

以前,Chrome 扩展程序使用入门教程是一个基本扩展程序示例,该示例会在用户点击扩展程序弹出式窗口中的按钮时更改当前网页的背景颜色。它还包含一个选项页面,您可以在其中从四种颜色中选择一种。

此基本示例未演示如何添加真实扩展程序中常见的功能。是时候进行改进了。

一种全新的方法

我们知道,开发者会依靠我们的文档开始 Chrome 扩展程序学习之旅,因此我们的目标是提供一个简单易用、适合新手且切实相关的学习路径。我们决定从头开始,而不是尝试改进现有的教程示例。

隆重推出经过改进的新版“开始使用”合集:

扩展程序 101
简要介绍了 Chrome 扩展程序开发的一些基本概念,例如 Web 技术和常用的扩展程序组件。此外,该指南还介绍了在 Chrome 应用商店中设计和分发扩展程序时需要注意的事项。
开发基础知识
通过创建 Hello, Extensions 示例介绍扩展程序开发工作流。该课程将详细介绍如何在开发过程中加载扩展程序、查找日志和错误、选择项目结构以及使用 TypeScript。
“阅读时间”教程
很高兴了解阅读一篇文章需要多长时间。“阅读时间”部分介绍了如何在每个扩展程序文档页面上插入包含预计阅读时间的元素。
“专注模式”教程
从页面中移除多余的杂乱信息,可以让我们专注于最相关的信息。“专注模式”演示了如何更改页面样式并隐藏一些干扰元素。
“标签页管理器”教程
在研究扩展程序开发时,您可能会在多个窗口中打开许多文档标签页。标签页管理器可整理您的 Chrome 扩展程序和 Chrome 应用商店文档标签页。

这些教程不仅会教您如何构建实际的扩展程序,还会分享开发提示和最佳实践。此外,使用这些扩展程序有助于您更好地阅读扩展程序文档。

预期结果

每个教程都包含以下部分:

  • 扩展程序将执行的任务。
  • 将要介绍的课程。
  • 开始前须知。
  • 构建扩展程序的分步说明。
  • 如何加载和测试扩展程序。

如果您愿意接受挑战,我们在本教程中提供了一些有关如何自定义扩展程序或为其添加其他功能的提示。

我们需要您的帮助

期待收到您的反馈!如果您发现这些指南中存在错误或不清楚的地方,请在我们的 GitHub 代码库中报告 bug。

我们认为,新版入门指南比旧版有了显著改进,但我们不会就此止步;我们将继续努力改进和扩充文档,更好地为所有扩展程序开发者提供服务。


照片由 Vardan Papikyan 拍摄,选自 Unsplash