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/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通用公共许可证免费分发。这不适用于具有自己个人许可的开发人员部分中提到的包含的库或图标。