展開 Chrome 擴充功能開發歷程的新方式

愛咪
Amy Steam

在這篇文章中,我們很高興針對 Chrome 擴充功能入門體驗進行一些重大的改善,並介紹一些協助您實現這個夢想的方法。

舊版指南

之前,Chrome 擴充功能入門教學課程是基本擴充功能範例,會在使用者點選擴充功能彈出式視窗中的按鈕時,變更目前網頁的背景顏色。還提供了選項頁面,您可以從中選擇四種顏色的其中一種。

這個基本範例並未示範如何新增實際擴充功能中的熱門功能。是時候換新氣了。

嶄新的做法

我們知道開發人員需要參閱我們的說明文件,才能踏上 Chrome 擴充功能的學習之旅,而我們的目標就是提供容易上手、容易使用且符合教學需求的學習途徑。與其嘗試改善現有的教學課程範例,我們不該從頭著手。

隆重推出全新改良版「開始使用」集合:

擴充功能指南
簡要介紹 Chrome 擴充功能開發作業 (例如網路技術和常用的擴充功能元件) 的一些基本概念。以及在 Chrome 線上應用程式商店中設計和發布擴充功能時的注意事項。
開發基本資訊
透過建立「Hello, Extensions」範例來介紹擴充功能開發工作流程。並逐步說明如何在開發過程中載入擴充功能、找出記錄檔和錯誤、選擇專案結構,以及使用 Typescript。
閱讀時間教學課程
很高興知道我們還要花多少時間閱讀文章。閱讀時間課程會教你如何在每個擴充功能說明文件頁面中插入含有預估閱讀時間的元素。
專注模式教學課程
移除多餘的網頁,可讓我們專注在最相關的資訊。專注模式示範如何變更頁面樣式及隱藏一些幹擾元素。
分頁管理員教學課程
在研究擴充功能開發情形時,您可能會在多個視窗中看到許多說明文件分頁。分頁管理員會整理您的 Chrome 擴充功能和 Chrome 線上應用程式商店的說明文件分頁。

這些教學課程不僅會說明如何建構實際使用的擴充功能,也會分享開發提示和最佳做法。此外,閱讀擴充功能說明文件時,也能透過這些擴充功能提升使用體驗。

預期程序

每個教學課程包含以下章節:

  • 擴充功能將執行的工作。
  • 本課程涵蓋的內容。
  • 開始之前的重要須知。
  • 建構擴充功能的逐步操作說明。
  • 如何載入及測試擴充功能。

如果你想參加挑戰,請參考以下的章節,瞭解如何自訂擴充功能或加入其他功能。

我們很樂意助您一臂之力

我們非常期待收到您的回覆!如果您在這些指南中看到錯誤或不明確的內容,請前往我們的 GitHub 存放區回報錯誤。

我們認為這份新版入門指南大幅改善舊版功能,但相關做法不會止於此。我們將持續改善和擴充說明文件,為所有擴充功能開發人員提供更好的服務。


相片來源:Vardan Papikyan,發表於 Unsplash 網站上