web developer

Web開發人員

Web開發人員擴展將各種Web開發人員工具添加到瀏覽器中。該擴展名可用於Chrome，Edge，Firefox和Opera，並將在這些瀏覽器支持的任何平台上運行，包括Windows，OS X和Linux。

該擴展名可以從其主頁上安裝：

• 主頁：https：//chrispederick.com/work/web-developer/

或直接來自鉻，邊緣，Firefox或Opera擴展存儲庫：

• Chrome：https：//chromewebstore.google.com/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm
• 邊緣：https：//microsoftedge.microsoft.com/addons/detail/web-developer/ilbdhapjffldgngebmnkdodohjapjccm
• Firefox：https：//addons.mozilla.org/en-us/firefox/addon/web-developer/
• 歌劇：https：//addons.opera.com/en/extensions/details/web-developer/

公告

有關Web開發人員擴展的公告，包括有關Beta版本的新聞和即將推出的版本的預覽，如下：

• 博客：https：//chrispederick.com/blog/
• Mastodon：https：//social.lol/@chrispederick

幫助

可以在其主頁上找到Web開發人員擴展程序的幫助：

• 幫助：https：//chrispederick.com/work/web-developer/help/
• 已知問題：https：//chrispederick.com/work/web-developer/issues/
• 待辦事項列表：https：//chrispederick.com/work/web-developer/to-do/

要報告新問題或建議新功能，請與我聯繫：

• 聯繫人：https：//chrispederick.com/contact/

開發人員

技術

Web開發人員擴展名用JavaScript，HTML和CSS編寫。

擴展文檔

有關如何編寫瀏覽器擴展的信息，請查看Chrome，Firefox和Opera文檔：

• Chrome：https：//developer.chrome.com/docs/extensions/
• 邊緣：https：//learn.microsoft.com/en-us/microsoft-edge/extensions-chromium/
• Firefox：https：//developer.mozilla.org/en-us/docs/mozilla/add-ons
• 歌劇：https：//dev.opera.com/extensions/

構建過程

擴展名使用Gulp構建系統。

一旦安裝了Gulp，通過運行以下操作來構建擴展名：

 gulp

為了構建Chrome，Edge，Firefox或Opera的擴展，僅運行gulp chrome ， gulp edge ， gulp firefox或gulp opera 。

構建擴展時，它將創建build/chrome ， build/edge ，構建build/firefox和build/opera目錄以及包裝版本的擴展版build/web-developer-chrome.zip ， build build/web-developer-edge.zip ， build/web-developer-firefox.xpi build/web-developer-opera.nex 。

可以通過在Chrome，Edge，Firefox和Opera文檔中分別加載build/chrome ， build/edge ，構建/ build/firefox build/opera ，可以通過在構建/鉻，構建/邊緣，構建/Firefox或構建/opera中加載未包裝的擴展來安裝擴展名。

包括庫

以下庫由IS的擴展名中使用並包含在：

• Bootstrap：https：//getbootstrap.com/
• codemirror：https：//codemirror.net/
• dompurify：https：//github.com/cure53/dompurify
• 埃里克·邁耶（Eric Meyer）的重置CSS：https：//meyerweb.com/eric/tools/css/css/reset/
• JS美容人：https：//github.com/beautify-web/js-beautify
• Mustache.js：https：//github.com/janl/mustache.js/從https://unpkg.com/browse/mustache/[email protected]/mustache.js導入

出於維護原因，不應將它們除外，以更新到其最新版本。

圖示

擴展中使用的圖標來自核，並且擴展中使用的任何新圖標也應來自那里以保持一致性。

編輯配置

包括一個EditorConfig文件，以統一不同編輯器的編碼樣式。

致謝

支持：

• Browserstack

作者

克里斯·佩德里克（Chris Pederick）

• https://chrispederick.com/
• https://social.lol/@chrispederick

執照

所有文件均根據GNU通用公共許可證免費分發。這不適用於具有自己個人許可的開發人員部分中提到的包含的庫或圖標。