我們很高興能分享一些關於 Chrome 擴充功能入門體驗的重要改進,以及實現夢想的一些方法。
舊版指南
以前,「Chrome 擴充功能入門」教學課程是基本擴充功能範例,當使用者點選擴充功能彈出式視窗中的按鈕時,這會變更目前網頁的背景顏色。還提供一個選項頁面,您可以從中選擇四種顏色。
這個基本示例並未說明如何新增實際擴充功能中的常用功能。是時候改變了。
全新做法
我們知道開發人員在學習 Chrome 擴充功能前,需要參考我們的說明文件,因此我們的目標是提供容易上手且切合需求的學習路徑。與其嘗試改善現有的教學課程範例,我們決定從頭開始。
全新改良的「開始使用」系列:
- 擴充功能指南
- 簡要說明 Chrome 擴充功能開發的基本概念,例如網路技術和常用的擴充功能元件。此外,也包括在 Chrome 線上應用程式商店設計及發布擴充功能時應留意的事項。
- 開發基本資訊
- 建立「Hello, Extensions」範例,導入擴充功能開發工作流程。並在開發期間逐步載入擴充功能、尋找記錄檔和錯誤、選擇專案結構,以及使用 Typescript。
- 閱讀時間教學課程
- 很高興知道我們需要多少時間讀完一篇文章。閱讀時間可教你如何在每個擴充功能說明文件頁面中插入內含預估讀取時間的元素。
- 專注模式教學課程
- 移除網頁的雜亂內容,讓我們的心思專注在最相關的資訊。焦點模式示範如何變更頁面樣式並隱藏幾個令人分心的元素。
- 分頁管理工具教學課程
- 在研究擴充功能開發時,您可能會在多個視窗中看到許多文件分頁。分頁管理工具可以整理 Chrome 擴充功能和 Chrome 線上應用程式商店文件分頁。
這些教學課程不僅會教您如何建立真實的擴充功能,也提供開發秘訣和最佳做法。此外,使用這些擴充功能還能改善閱讀擴充功能說明文件的體驗。
後續程序
每個教學課程都包含以下各節:
- 擴充功能將執行的工作。
- 本課程將介紹這些課程內容。
- 開始前的重要須知
- 建構擴充功能的逐步操作說明。
- 如何載入及測試擴充功能。
如果您有挑戰,我們在下一節中提供一些秘訣,教您如何在擴充功能中自訂或加入其他功能。
我們需要你幫忙
我們很期待收到你的回覆!如果您在這些指南中看到錯誤或不清楚,請前往 GitHub 存放區回報錯誤。
我們認為新版入門指南雖然比舊版指南更出色,但這並非僅止於此;我們會持續改善並擴充說明文件,為所有擴充功能開發人員提供更優質的服務。
相片來源:Vardan Papikyan 發表於 Unsplash 網站上