Brackets用 HTML、CSS 与 JavaScript 构建的开源 Web 代码编辑器——特性、安装与二次开发指南【免费下载链接】bracketsAn open source code editor for the web, written in JavaScript, HTML and CSS.项目地址: https://gitcode.com/gh_mirrors/br/bracketsBrackets 是一款面向 HTML、CSS 与 JavaScript 开发者的现代开源代码编辑器其独特之处在于编辑器本身也完全用 HTML、CSS 和 JavaScript 编写。本文基于仓库根目录 README.md 与源码梳理它的设计理念、Quick Edit 与 Live Preview 两大核心特性、安装运行方式以及如何参与社区贡献与二次开发帮助读者快速上手并理解其底层实现。Brackets 是什么Brackets 是一款面向 Web 前端开发的现代开源代码编辑器专注于 HTML、CSS 和 JavaScript 三类语言同时它自身也由 HTML、CSS 和 JavaScript 构建见 README.md。这意味着编辑器与它服务的对象使用同一种语言技术栈所有使用 Brackets 的开发者在修改网页的同时也天然拥有理解、扩展甚至重构编辑器本身的能力。仓库内大量源码以模块化的 JavaScript 实现例如 入口启动模块 src/main.js 负责配置 requirejs 的路径映射与 locale再加载 应用根模块 src/brackets.js 完成 UI 初始化与全局菜单、快捷键绑定。与许多传统代码编辑器不同Brackets 在设计上强调两个核心差异化理念工具不应妨碍编码。它不试图用大量面板和图标填满工作区而是通过 Quick Edit 这种内联编辑 UI把与上下文相关的代码与工具直接呈现在光标所在位置。与浏览器保持同步。通过 Live PreviewBrackets 与真实浏览器直接协作把代码修改实时推送到浏览器并在源码与浏览器视图之间快速跳转。从源码目录结构看src/editor/CSSInlineEditor.js 与 src/editor/MultiRangeInlineEditor.js 实现了 Quick Edit 的编辑器内核而 src/LiveDevelopment/ 目录则集中存放了 Live Preview 的整套实现后续章节将分别展开。Quick Edit内联上下文编辑设计思想与操作方式Quick Edit 是 Brackets 最具代表性的特性当你在 HTML 中编辑标签或属性时无需切换到独立的 CSS 文件并丢失当前编辑上下文只需按下Cmd/Ctrl E一个内联的快速编辑器就会在当前光标处弹出显示所有相关的 CSS 规则。修改完 CSS 后按ESC即可回到 HTML 编辑也可以让这些内联规则保持打开它们会成为 HTML 编辑器的一部分——在快速编辑器外按ESC则会一次性全部收起。从源码实现看src/editor/CSSInlineEditor.js 中的_getSelectorName会借助HTMLUtils.getTagInfo分析光标所在位置判断当前是类型选择器标签名、类选择器还是 id 选择器进而从项目内查找匹配的 CSS 规则光标位于标签名上 → 使用标签名作为选择器光标位于class属性值内部 → 以光标所在的那一个类名构造.className选择器光标位于id属性上 → 构造#id选择器。Quick Edit 并不仅限于单个规则CSS 规则会被收集为多段范围交由 src/editor/MultiRangeInlineEditor.js 以多段内联编辑器形式呈现让开发者可以在一个内联视图里浏览和编辑所有命中同一选择器的规则。可编辑的范围与新增规则除了查找已有规则Quick Edit 还支持新建规则。当光标所在的标签目前没有任何匹配的 CSS 规则时内联编辑器中会出现 New Rule新建规则按钮点击后即可为当前选择器创建一条新规则。值得注意的是Quick Edit 的能力超越了普通 CSS它同样能解析并命中LESS 与 SCSS文件中的规则包括嵌套规则。这一能力在源码中有直接支撑——src/editor/CSSInlineEditor.js 通过ProjectManager.getLanguageFilter([css, less, scss])获取项目内的 CSS/LESS/SCSS 文件列表进行规则匹配。因此使用预处理器编写样式的项目同样可以享受内联编辑的便利。仓库自带的入门示例 samples/root/Getting Started/index.html 也专门示范了这一用法把光标放在samp或p标签上按Cmd/Ctrl E即可看到或新建对应的 CSS 规则。Live Preview与浏览器实时同步工作原理Live Preview 让 Brackets 与浏览器历史上默认使用 Chrome并通过远程调试端口连接直接协作编辑代码后修改被实时推送到浏览器页面无需手动刷新同时还可以在真实源码与浏览器视图之间来回跳转定位对应元素。从源码注释与结构看核心管理器 src/LiveDevelopment/LiveDevelopment.js 完整描述了会话生命周期启动调用open读取当前文档启动带远程调试端口的浏览器通过 Inspector 建立与远程调试器的连接然后加载所有 Agents停止调用close关闭浏览器窗口、断开 Inspector、卸载所有 Agents 并清理资源。会话状态通过statusChange事件对外派发状态码定义在 src/LiveDevelopment/LiveDevelopment.js状态码含义-1错误Error0未激活Inactive1正在连接远程调试器Connecting2正在加载 AgentsLoading agents3已激活Active4失去同步Out of sync5同步错误Sync error状态切换原因reason包括explicit_close主动调用close()、navigated_away浏览器跳转到项目外的地址、detached_target_closed标签页或窗口被关闭、detached_replaced_with_devtools浏览器中打开了开发者工具等。底层模块构成Live Development 功能在仓库中不是单一文件而是一组协同工作的模块见 src/LiveDevelopment/AgentsDOMAgent、CSSAgent、RemoteAgent、HighlightAgent、GotoAgent、NetworkAgent、ScriptAgent等各自负责浏览器端的一类能力DOM 操作、CSS 注入、元素高亮、跳转定位等DocumentsHTMLDocument、CSSDocument、CSSPreprocessorDocument、JSDocument对应不同类型源码在 Live 会话中的文档模型ServersBaseServer、FileServer、UserServer负责以何种方式把项目提供给浏览器访问transportsWebSocketTransport以及 src/LiveDevelopment/transports/node/ 下的 Node 侧传输实现负责 Brackets 与浏览器之间的通信通道Inspectorsrc/LiveDevelopment/Inspector/Inspector.js 封装了对浏览器远程调试协议的调用。此外面向多浏览器场景的 src/LiveDevelopment/LiveDevMultiBrowser.js 与 src/LiveDevelopment/MultiBrowserImpl/ 目录提供了另一套跨浏览器实现相关协议、launcher 与文档实现均在其中。安装与运行下载与启动Brackets 的安装包面向 Mac、Windows 和 LinuxDebian/Ubuntu提供。安装后首次启动时Brackets 默认会打开一个包含简单 Getting Started 入门内容的文件夹仓库中即 samples/root/Getting Started/ 下的示例且该示例被翻译为二十余种语言如 samples/zh-cn/Getting Started/ 等。想编辑自己的代码时通过File Open Folder文件 打开文件夹选择目标目录即可。这里有一个重要的概念Brackets 把当前打开的文件夹视为一个project项目。入门示例 samples/root/Getting Started/index.html 中明确说明Code Hints代码提示、Live Preview 和 Quick Edit 等特性只作用于当前打开文件夹内的文件。通过左侧边栏顶部的下拉框可以切换文件夹其中也会保留之前打开过的目录历史。为何不能直接在浏览器中打开Brackets 虽然完全用 HTML/CSS/JS 构建但目前以桌面应用形态运行在一个轻量原生壳native shell中以便访问本地文件系统。README 中特别提醒直接双击打开index.html是不会正常工作的因为缺少原生壳提供的文件系统访问能力。这一点从启动链路也能印证应用入口 src/main.js 将fileSystemImpl指向filesystem/impls/appshell/AppshellFileSystem即通过原生壳实现文件系统接口替换该路径即可切换到其他实现例如基于云存储的文件系统。从源码构建与测试仓库以 Grunt 作为构建工具见 Gruntfile.js常用的任务包括grunt install安装并准备开发环境依赖grunt test运行完整测试套件实际包含eslint代码规范检查、jasmine单元测试与nls-check本地化字符串检查grunt build/grunt build-prerelease生成发布构建grunt default等价于grunt test。依赖与脚本定义见 package.json当前版本为1.15.0-0运行时依赖包括async、lodash、request、semver、ws等测试与构建则依赖 jasmine、phantomjs、webpack、grunt 系列插件postinstall钩子会自动执行grunt install。扩展生态与内置扩展Brackets 的核心功能之外社区开发了大量扩展以提供各种实用功能。仓库中内置的默认扩展位于 src/extensions/default/随 Brackets 一起分发并默认启用该目录的 README 对此有说明涵盖代码提示类HTMLCodeHints、CSSCodeHints、JavaScriptCodeHints、SVGCodeHints、UrlCodeHints内联编辑器类InlineColorEditor颜色选择、InlineTimingFunctionEditorCSS 缓动函数编辑语言工具类JSLint、LESSSupport、PhpTooling、JavaScriptRefactoring编辑器增强类CodeFolding代码折叠、QuickView、NavigationAndHistory、RecentProjects主题类LightTheme、DarkTheme。这些默认扩展同时是学习如何编写 Brackets 扩展的绝佳范例Brackets 的扩展机制建立在 requirejs 模块系统之上扩展与核心模块共享同一套 API 约定。参与社区与二次开发如何反馈与贡献如果你发现了一个可复现的 bug请遵循以下流程先查阅排障资料如果仍未解决先搜索已有的 issue避免重复提交。提交 bug 时请包含可稳定复现问题的步骤、实际结果与预期结果、截图以及操作系统和 Brackets 版本号。提交前还应当禁用所有扩展以确认问题属于核心 bug 而非某个扩展引起详见 CONTRIBUTING.md。对于新功能建议可以先查看功能 backlog 中是否已经存在该需求如果已有则可以通过投票upvote表达支持否则按上述方式提交 issue维护者会将其移入功能 backlog。完整流程同样记录在 CONTRIBUTING.md 中。如何参与代码开发想参与编码的开发者可以阅读 CONTRIBUTING.md 了解协作约定。值得强调的是 Brackets 的自我承载特性由于编辑器本身用 Web 技术编写团队日常正是使用 Brackets 来构建 Brackets——你的贡献将直接改进一个用你熟悉的技术写成的编辑器。从源码结构看代码组织的几个关键入口有助于快速定位功能src/main.jsrequirejs 引导配置与入口加载src/brackets.js应用根模块初始化 UI、绑定全局菜单与键盘快捷键src/editor/编辑器核心与内联编辑相关实现src/LiveDevelopment/Live Preview 全栈实现src/language/语言感知能力如 CSSUtils.js、HTMLInstrumentation.jstest/spec/与各模块一一对应的单元测试如CSSInlineEdit-test.js、LiveDevelopment-test.js是理解模块行为的直接参考。编辑器底层基于 CodeMirrorBrackets 在 src/brackets.js 中加载了 CodeMirror 的 closebrackets、closetag、matchbrackets、matchtags、xml-fold 等 addon 以及 Sublime 键位方案并在此基础上叠加自己的命令、菜单与快捷编辑层。项目现状与后续维护README 顶部声明了一项重要的项目事实Adobe 已于 2021 年 9 月 1 日结束对 Brackets 的官方支持。在此之后希望继续使用、维护和改进 Brackets 的开发者可以通过fork 该项目的方式延续开发Adobe 也通过与微软的合作鼓励用户迁移到基于开源的免费编辑器 Visual Studio Code。因此本文所描述的特性与源码以当前仓库版本号见 package.json 中的1.15.0-0为准若你正在使用 Brackets应优先考虑 fork 社区分支以获取后续维护与修复。小结Brackets 的核心价值在于它验证了一种面向 Web 的编辑器用 Web 技术本身来构建的理念Quick Edit把 CSS含 LESS/SCSS上下文内联到 HTML 编辑现场实现Cmd/Ctrl E的无缝上下文切换与新建规则Live Preview通过远程调试协议与浏览器深度协作实现编辑即预览、源码与视图互跳其完整实现集中在 src/LiveDevelopment/编辑器以原生壳包裹的桌面应用形式运行文件系统通过可替换的fileSystemImpl抽象接入丰富的默认扩展与 requirejs 模块体系使它既是一套好用的工具也是一个开放、可学习、可改造的 Web 前端代码库。如果你希望亲自体验安装官方安装包后打开任意 Web 项目文件夹把光标放到标签上按Cmd/Ctrl E试试 Quick Edit再对 HTML 文件开启 Live Preview 感受实时同步——这两步足以领会 Brackets 区别于传统编辑器的工作方式。【免费下载链接】bracketsAn open source code editor for the web, written in JavaScript, HTML and CSS.项目地址: https://gitcode.com/gh_mirrors/br/brackets创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 Brackets：用 HTML、CSS 与 JavaScript 构建的开源 Web 代码编辑器——特性、安装与二次开发指南
Brackets用 HTML、CSS 与 JavaScript 构建的开源 Web 代码编辑器——特性、安装与二次开发指南【免费下载链接】bracketsAn open source code editor for the web, written in JavaScript, HTML and CSS.项目地址: https://gitcode.com/gh_mirrors/br/bracketsBrackets 是一款面向 HTML、CSS 与 JavaScript 开发者的现代开源代码编辑器其独特之处在于编辑器本身也完全用 HTML、CSS 和 JavaScript 编写。本文基于仓库根目录 README.md 与源码梳理它的设计理念、Quick Edit 与 Live Preview 两大核心特性、安装运行方式以及如何参与社区贡献与二次开发帮助读者快速上手并理解其底层实现。Brackets 是什么Brackets 是一款面向 Web 前端开发的现代开源代码编辑器专注于 HTML、CSS 和 JavaScript 三类语言同时它自身也由 HTML、CSS 和 JavaScript 构建见 README.md。这意味着编辑器与它服务的对象使用同一种语言技术栈所有使用 Brackets 的开发者在修改网页的同时也天然拥有理解、扩展甚至重构编辑器本身的能力。仓库内大量源码以模块化的 JavaScript 实现例如 入口启动模块 src/main.js 负责配置 requirejs 的路径映射与 locale再加载 应用根模块 src/brackets.js 完成 UI 初始化与全局菜单、快捷键绑定。与许多传统代码编辑器不同Brackets 在设计上强调两个核心差异化理念工具不应妨碍编码。它不试图用大量面板和图标填满工作区而是通过 Quick Edit 这种内联编辑 UI把与上下文相关的代码与工具直接呈现在光标所在位置。与浏览器保持同步。通过 Live PreviewBrackets 与真实浏览器直接协作把代码修改实时推送到浏览器并在源码与浏览器视图之间快速跳转。从源码目录结构看src/editor/CSSInlineEditor.js 与 src/editor/MultiRangeInlineEditor.js 实现了 Quick Edit 的编辑器内核而 src/LiveDevelopment/ 目录则集中存放了 Live Preview 的整套实现后续章节将分别展开。Quick Edit内联上下文编辑设计思想与操作方式Quick Edit 是 Brackets 最具代表性的特性当你在 HTML 中编辑标签或属性时无需切换到独立的 CSS 文件并丢失当前编辑上下文只需按下Cmd/Ctrl E一个内联的快速编辑器就会在当前光标处弹出显示所有相关的 CSS 规则。修改完 CSS 后按ESC即可回到 HTML 编辑也可以让这些内联规则保持打开它们会成为 HTML 编辑器的一部分——在快速编辑器外按ESC则会一次性全部收起。从源码实现看src/editor/CSSInlineEditor.js 中的_getSelectorName会借助HTMLUtils.getTagInfo分析光标所在位置判断当前是类型选择器标签名、类选择器还是 id 选择器进而从项目内查找匹配的 CSS 规则光标位于标签名上 → 使用标签名作为选择器光标位于class属性值内部 → 以光标所在的那一个类名构造.className选择器光标位于id属性上 → 构造#id选择器。Quick Edit 并不仅限于单个规则CSS 规则会被收集为多段范围交由 src/editor/MultiRangeInlineEditor.js 以多段内联编辑器形式呈现让开发者可以在一个内联视图里浏览和编辑所有命中同一选择器的规则。可编辑的范围与新增规则除了查找已有规则Quick Edit 还支持新建规则。当光标所在的标签目前没有任何匹配的 CSS 规则时内联编辑器中会出现 New Rule新建规则按钮点击后即可为当前选择器创建一条新规则。值得注意的是Quick Edit 的能力超越了普通 CSS它同样能解析并命中LESS 与 SCSS文件中的规则包括嵌套规则。这一能力在源码中有直接支撑——src/editor/CSSInlineEditor.js 通过ProjectManager.getLanguageFilter([css, less, scss])获取项目内的 CSS/LESS/SCSS 文件列表进行规则匹配。因此使用预处理器编写样式的项目同样可以享受内联编辑的便利。仓库自带的入门示例 samples/root/Getting Started/index.html 也专门示范了这一用法把光标放在samp或p标签上按Cmd/Ctrl E即可看到或新建对应的 CSS 规则。Live Preview与浏览器实时同步工作原理Live Preview 让 Brackets 与浏览器历史上默认使用 Chrome并通过远程调试端口连接直接协作编辑代码后修改被实时推送到浏览器页面无需手动刷新同时还可以在真实源码与浏览器视图之间来回跳转定位对应元素。从源码注释与结构看核心管理器 src/LiveDevelopment/LiveDevelopment.js 完整描述了会话生命周期启动调用open读取当前文档启动带远程调试端口的浏览器通过 Inspector 建立与远程调试器的连接然后加载所有 Agents停止调用close关闭浏览器窗口、断开 Inspector、卸载所有 Agents 并清理资源。会话状态通过statusChange事件对外派发状态码定义在 src/LiveDevelopment/LiveDevelopment.js状态码含义-1错误Error0未激活Inactive1正在连接远程调试器Connecting2正在加载 AgentsLoading agents3已激活Active4失去同步Out of sync5同步错误Sync error状态切换原因reason包括explicit_close主动调用close()、navigated_away浏览器跳转到项目外的地址、detached_target_closed标签页或窗口被关闭、detached_replaced_with_devtools浏览器中打开了开发者工具等。底层模块构成Live Development 功能在仓库中不是单一文件而是一组协同工作的模块见 src/LiveDevelopment/AgentsDOMAgent、CSSAgent、RemoteAgent、HighlightAgent、GotoAgent、NetworkAgent、ScriptAgent等各自负责浏览器端的一类能力DOM 操作、CSS 注入、元素高亮、跳转定位等DocumentsHTMLDocument、CSSDocument、CSSPreprocessorDocument、JSDocument对应不同类型源码在 Live 会话中的文档模型ServersBaseServer、FileServer、UserServer负责以何种方式把项目提供给浏览器访问transportsWebSocketTransport以及 src/LiveDevelopment/transports/node/ 下的 Node 侧传输实现负责 Brackets 与浏览器之间的通信通道Inspectorsrc/LiveDevelopment/Inspector/Inspector.js 封装了对浏览器远程调试协议的调用。此外面向多浏览器场景的 src/LiveDevelopment/LiveDevMultiBrowser.js 与 src/LiveDevelopment/MultiBrowserImpl/ 目录提供了另一套跨浏览器实现相关协议、launcher 与文档实现均在其中。安装与运行下载与启动Brackets 的安装包面向 Mac、Windows 和 LinuxDebian/Ubuntu提供。安装后首次启动时Brackets 默认会打开一个包含简单 Getting Started 入门内容的文件夹仓库中即 samples/root/Getting Started/ 下的示例且该示例被翻译为二十余种语言如 samples/zh-cn/Getting Started/ 等。想编辑自己的代码时通过File Open Folder文件 打开文件夹选择目标目录即可。这里有一个重要的概念Brackets 把当前打开的文件夹视为一个project项目。入门示例 samples/root/Getting Started/index.html 中明确说明Code Hints代码提示、Live Preview 和 Quick Edit 等特性只作用于当前打开文件夹内的文件。通过左侧边栏顶部的下拉框可以切换文件夹其中也会保留之前打开过的目录历史。为何不能直接在浏览器中打开Brackets 虽然完全用 HTML/CSS/JS 构建但目前以桌面应用形态运行在一个轻量原生壳native shell中以便访问本地文件系统。README 中特别提醒直接双击打开index.html是不会正常工作的因为缺少原生壳提供的文件系统访问能力。这一点从启动链路也能印证应用入口 src/main.js 将fileSystemImpl指向filesystem/impls/appshell/AppshellFileSystem即通过原生壳实现文件系统接口替换该路径即可切换到其他实现例如基于云存储的文件系统。从源码构建与测试仓库以 Grunt 作为构建工具见 Gruntfile.js常用的任务包括grunt install安装并准备开发环境依赖grunt test运行完整测试套件实际包含eslint代码规范检查、jasmine单元测试与nls-check本地化字符串检查grunt build/grunt build-prerelease生成发布构建grunt default等价于grunt test。依赖与脚本定义见 package.json当前版本为1.15.0-0运行时依赖包括async、lodash、request、semver、ws等测试与构建则依赖 jasmine、phantomjs、webpack、grunt 系列插件postinstall钩子会自动执行grunt install。扩展生态与内置扩展Brackets 的核心功能之外社区开发了大量扩展以提供各种实用功能。仓库中内置的默认扩展位于 src/extensions/default/随 Brackets 一起分发并默认启用该目录的 README 对此有说明涵盖代码提示类HTMLCodeHints、CSSCodeHints、JavaScriptCodeHints、SVGCodeHints、UrlCodeHints内联编辑器类InlineColorEditor颜色选择、InlineTimingFunctionEditorCSS 缓动函数编辑语言工具类JSLint、LESSSupport、PhpTooling、JavaScriptRefactoring编辑器增强类CodeFolding代码折叠、QuickView、NavigationAndHistory、RecentProjects主题类LightTheme、DarkTheme。这些默认扩展同时是学习如何编写 Brackets 扩展的绝佳范例Brackets 的扩展机制建立在 requirejs 模块系统之上扩展与核心模块共享同一套 API 约定。参与社区与二次开发如何反馈与贡献如果你发现了一个可复现的 bug请遵循以下流程先查阅排障资料如果仍未解决先搜索已有的 issue避免重复提交。提交 bug 时请包含可稳定复现问题的步骤、实际结果与预期结果、截图以及操作系统和 Brackets 版本号。提交前还应当禁用所有扩展以确认问题属于核心 bug 而非某个扩展引起详见 CONTRIBUTING.md。对于新功能建议可以先查看功能 backlog 中是否已经存在该需求如果已有则可以通过投票upvote表达支持否则按上述方式提交 issue维护者会将其移入功能 backlog。完整流程同样记录在 CONTRIBUTING.md 中。如何参与代码开发想参与编码的开发者可以阅读 CONTRIBUTING.md 了解协作约定。值得强调的是 Brackets 的自我承载特性由于编辑器本身用 Web 技术编写团队日常正是使用 Brackets 来构建 Brackets——你的贡献将直接改进一个用你熟悉的技术写成的编辑器。从源码结构看代码组织的几个关键入口有助于快速定位功能src/main.jsrequirejs 引导配置与入口加载src/brackets.js应用根模块初始化 UI、绑定全局菜单与键盘快捷键src/editor/编辑器核心与内联编辑相关实现src/LiveDevelopment/Live Preview 全栈实现src/language/语言感知能力如 CSSUtils.js、HTMLInstrumentation.jstest/spec/与各模块一一对应的单元测试如CSSInlineEdit-test.js、LiveDevelopment-test.js是理解模块行为的直接参考。编辑器底层基于 CodeMirrorBrackets 在 src/brackets.js 中加载了 CodeMirror 的 closebrackets、closetag、matchbrackets、matchtags、xml-fold 等 addon 以及 Sublime 键位方案并在此基础上叠加自己的命令、菜单与快捷编辑层。项目现状与后续维护README 顶部声明了一项重要的项目事实Adobe 已于 2021 年 9 月 1 日结束对 Brackets 的官方支持。在此之后希望继续使用、维护和改进 Brackets 的开发者可以通过fork 该项目的方式延续开发Adobe 也通过与微软的合作鼓励用户迁移到基于开源的免费编辑器 Visual Studio Code。因此本文所描述的特性与源码以当前仓库版本号见 package.json 中的1.15.0-0为准若你正在使用 Brackets应优先考虑 fork 社区分支以获取后续维护与修复。小结Brackets 的核心价值在于它验证了一种面向 Web 的编辑器用 Web 技术本身来构建的理念Quick Edit把 CSS含 LESS/SCSS上下文内联到 HTML 编辑现场实现Cmd/Ctrl E的无缝上下文切换与新建规则Live Preview通过远程调试协议与浏览器深度协作实现编辑即预览、源码与视图互跳其完整实现集中在 src/LiveDevelopment/编辑器以原生壳包裹的桌面应用形式运行文件系统通过可替换的fileSystemImpl抽象接入丰富的默认扩展与 requirejs 模块体系使它既是一套好用的工具也是一个开放、可学习、可改造的 Web 前端代码库。如果你希望亲自体验安装官方安装包后打开任意 Web 项目文件夹把光标放到标签上按Cmd/Ctrl E试试 Quick Edit再对 HTML 文件开启 Live Preview 感受实时同步——这两步足以领会 Brackets 区别于传统编辑器的工作方式。【免费下载链接】bracketsAn open source code editor for the web, written in JavaScript, HTML and CSS.项目地址: https://gitcode.com/gh_mirrors/br/brackets创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考