# 探索 Zed 编辑器:代码编辑器的未来 **Published by:** [Nexseer](https://paragraph.com/@nexseer/) **Published on:** 2024-08-29 **URL:** https://paragraph.com/@nexseer/zed ## Content https://github.com/Nexseer/zed-configZed 演示一、Zed 是什么?🧐二、为什么选择 Zed ?😎1. Fast ⚡2. Intelligent 💻3. Collaborative 📶三、怎么使用 Zed ? 😉1. 快速入门 📝2. 自定义配置 ✍️Vim 模式代理主题配置外观配置基础配置开发配置数据收集设置3. 快捷键 ⌨️系统默认快捷键自定义快捷键Vim mode 内置快捷键整理四、AI 使用 🌟1. Supermaven 智能补全 ✨2. AI Assistant ⭐如何开启Zed AI ?Assistant PanelInline AssistantPrompting五、协作 💥六、插件商城 🔌一、Zed 是什么?🧐Zed is a next-generation code editor designed for high-performance collaboration with humans and AI.Zed Editor 是一款支持多人协作的代码编辑器,由 Atom 编辑器的原作者主导开发,底层采用 Rust,主打 “高性能” 😮,无论是插入延迟、启动时间还是内存占用都十分优秀。 Zed Editor 以一种全新的视觉美感进入人们的视野,其旨在为开发者提供一个高效、流畅、且直观的 👍 编程环境。创始人 Nathan 在访谈中的一些看法 💭: “我梦寐以求的工具既要功能强大,又要拥有简约时尚的外观,并且运行速度飞快。但是,超快的速度和强大的功能很难兼得。可以说我职业生涯的大部分时间都在努力实现这二者的结合,这正是 Zed 的目标。同时我们倾向于在用户体验上坚持简约主义。” “我不想用按钮取代命令行体验,那对我来说没什么意义。我喜欢接近机器,用语言的方式与它交流。我希望 IDE 能够意识到终端和命令行的存在并干净地集成它们,而不是试图在可视化界面里定义一切。作为 Unix 哲学的自然延伸和补充,我觉得这更适合我。但是,如果我可以通过一个快捷键来运行测试,而不是切换到终端,然后上下键选择再回车,那我很乐意接受它。但我不希望它隐藏了本质,因为这其实就是在运行一个命令。” “我一直以来的目标是打造一款轻量、简约、体验近似文本编辑器,但又拥有 IDE 强大功能的产品,尽量避免那种延迟的体验和笨重的 UI。这正是我很早之前就想要的,同时它还应该是可扩展的。”二、为什么选择 Zed ?😎1. Fast ⚡Zed Editor 的轻量级设计让它能够迅速启动,是注重效率的开发人员的理想选择。它以简约为核心,专注于速度和资源的优化利用,确保在不繁琐配置的情况下即可轻松上手。同时,它也提供了丰富的个性化选项,能够满足极客用户的高级需求。2. Intelligent 💻Zed Editor 集成了 AI 辅助编码功能,使得开发体验更加智能化和高效。无论是代码补全、错误检测,还是自动重构,AI 都能在你编码的每一步提供帮助。这种智能辅助不仅加快了开发速度,还减少了手动编码中的错误和重复工作。3. Collaborative 📶Zed Editor 最具现代化功能的是团队协作支持。其通过 Channel 和 CRDTs 来支持多人协作开发,意味着开发团队可以同时多人修改同一个文件,并可以同时进行交流讨论。更多的细节可以查看参考 📋 这篇文章:Zed: 用 Rust 实现终极编辑器之梦三、怎么使用 Zed ? 😉1. 快速入门 📝Zed Editor 目前支持 Mac 与 Linux 系统,后续会提供对于 Windows 系统的官方支持!!Mac 系统支持 Catalina (10.15) - Sonoma (14.x) 版本, Linux 系统需要安装相关依赖,查看 System Requirements - Zed 。 👉 Linux 安装 Zed 👉 Mac 安装 Zed Zed Editor 官方尚未发布适用于 Windows 的版本。 不过,有几种方法可以在 Windows 上使用 Zed 编辑器:自行编译或用其他人编译好的;使用 WSL (Windows Subsystem for Linux):在 WSL 中运行 Zed Editor 的 Linux 版本。2. 自定义配置 ✍️👉 官方手册:Configuring Zed - Zed 👉 官方默认设置:zed/assets/settings/default.json 打开设置 settings.json,有以下两种办法:快捷键 Ctrl ,打开命令面板 Crtl Shift P,输入 zed: open settings 来打开 settings.json 文件。Vim 模式Zed Editor 原生支持 Vim 模式,在 settings.json 文件添加:"vim_mode": true,代理在 settings.json 文件添加:"proxy": "http://127.0.0.1:7890",,方便后续 Zed AI 的使用,关闭并重新启动Zed编辑器,使新的代理设置生效。主题配置👉 查看各种主题效果:Zed themes通过右上角头像下拉框中的 Theme,可以预览内置主题通过右上角头像下拉框中的 Extension,安装主题插件,我使用的就是 base16 插件,选择其中的 snazzy 主题自定义主题:将主题json文件(如GitHub - Brunowilliang/zedspace中的zedspace.json)放置 .config/zed/themes/ 下,在 settings.json 文件添加:// 更换主题名 "theme": { "mode": "dark", "light": "One Light", "dark": "ZedSpace Dark Theme" }, 👉 更多配置查看官方手册:Themes - Zed外观配置"ui_font_size": 22, // 用户界面(UI)中的字体样式 "ui_font_family": "Cascadia Mono PL", "buffer_font_size": 26, // 代码编辑区(Buffer)的字体样式 "buffer_font_family": "JetBrains Mono", "buffer_font_weight": 500, "relative_line_numbers": true, // 隐藏标签栏中的导航历史按钮 "tab_bar": { "show_nav_history_buttons": false }, // 启用文件图标显示,在标签页中显示文件类型对应的图标 // 在标签页中显示文件的 Git 状态 "tabs": { "file_icons": true, "git_status": true }, // 内联提示设置 "inlay_hints": { "enabled": true, "font_family": "Consolas" }, // 根据缩进级别进行着色 "indent_guides": { "coloring": "indent_aware" }, // 启用软换行,当行长度超过编辑器宽度时自动换行 "soft_wrap": "editor_width", 基础配置Zed Editor 内置格式化功能,通过语言服务器协议(LSP)来实现代码格式化。"tab_size": 2, // 启用文件保存时自动格式化功能 "format_on_save": "on", // 设置垂直滚动的边距 "vertical_scroll_margin": 6, // 编辑器启动时不会自动恢复上次打开的文件或会话 "restore_on_startup": "none", // 禁用在新行继续注释的功能 "extend_comment_on_newline": false, // 将特定的文件扩展名与它们对应的文件类型进行关联 "file_types": { "C++": ["c", "h", "cpp", "hpp"], "*.mdx": ["markdown"] }, // 文件扫描时要排除的文件和目录模式 "file_scan_exclusions": [ "**/.git", "**/.svn", "**/.hg", "**/CVS", "**/.DS_Store", "**/Thumbs.db", "**/.classpath", "**/.settings", "**/vendor", "**/.tmp*" ], // 搜索时要排除的文件和目录 "search.exclude": { "**/*.snap": true "**/.git": true "**/.github": false "**/.nuxt": true "**/.output": true "**/.pnpm": true "**/.vscode": true "**/.yarn": true "**/node_modules": true "**/out/**": true "**/package-lock.json": true "**/pnpm-lock.yaml": true "**/temp": true "**/yarn.lock": true "**/CHANGELOG*": true "**/LICENSE*": true }, "terminal": { "font_family": "Cascadia Code NF", "toolbar": { "title": false }, // 启用在终端中选择文本时自动复制到剪贴板的功能 "copy_on_select": true }, "git": { // 启用 Git 集成功能 "enabled": true, // 定期从远程仓库获取最新的更改 "autoFetch": true, // 设置自动获取的时间间隔为 300 秒(5分钟) "autoFetchInterval": 300, // 当编辑器窗口获得焦点时自动获取最新的 Git 更改 "autoFetchOnFocus": true, // 当编辑器窗口切换时自动获取最新的 Git 更改 "autoFetchOnWindowChange": true, // 在构建项目时自动获取最新的 Git 更改 "autoFetchOnBuild": true, // 在编辑器中显示文件的 Git 状态 "git_status": true, // 在指定的构建事件(如构建、运行、调试)时自动获取最新的Git更改 "autoFetchOnBuildEvents": [ "build", "run", "debug" ], // 设置在构建事件发生后延迟 1500 毫秒(1.5秒)再进行自动获取 "autoFetchOnBuildEventsDelay": 1500, // 设置在构建后延迟 1500 毫秒(1.5秒)再进行自动获取 "autoFetchOnBuildDelay": 1500, // 在编辑器的行号栏(gutter)中显示 Git 状态,仅显示已跟踪文件的状态 "git_gutter": "tracked_files", // ,在代码行旁边显示最后一次修改该行的提交信息 "inline_blame": { "enabled": false, "position": "right" } }, 需要手动执行 git pull 命令来合并更改 ⛔开发配置Zed Editor 在语言配置方面做得非常好,提供了开箱即用的多语言支持、自动格式化、代码补全等功能,极大地简化了开发者的配置工作。 👉 Configuring Languages - Zed 👉 All Languages - Zedsource.organizeImports: true:在格式化代码时自动整理导入语句。source.fixAll.eslint: true:在格式化代码时自动修复所有 ESLint 报告的问题。Rust 中日常编码中频繁使用 check,定期或在代码审查前使用 clippy。clippy 是 Rust 的一个 lint 工具,提供了更多的代码风格和错误检查。"languages": { "C++": { "formatter": { "external": { "command": "clang-format", "arguments": ["-style={BasedOnStyle: Google, IndentWidth: 2}"] } } }, "Go": { "code_actions_on_format": { "source.organizeImports": true } }, "Rust": { "tab_size": 2 }, "TSX": { "formatter": { "external": { "command": "prettier", "arguments": ["--stdin-filepath", "{buffer_path}", "--tab-width", "2"] } }, "code_actions_on_format": { "source.organizeImports": true, "source.fixAll.eslint": true } }, "JavaScript": { "formatter": { "external": { "command": "prettier", "arguments": ["--stdin-filepath", "{buffer_path}", "--tab-width", "2"] } }, "code_actions_on_format": { "source.fixAll.eslint": true } }, "TypeScript": { "formatter": { "external": { "command": "prettier", "arguments": ["--stdin-filepath", "{buffer_path}", "--tab-width", "2"] } }, "code_actions_on_format": { "source.organizeImports": true, "source.fixAll.eslint": true } } }, "lsp": { "rust-analyzer": { "initialization_options": { "checkOnSave": { // rust-analyzer.check.command (default: "check") // "command": "clippy" } } }, "eslint": { "settings": { "codeActionOnSave": { "rules": ["import/order"] } } } } 数据收集设置不允许 Zed Industries 收集匿名使用数据~"telemetry": { "diagnostics": false, "metrics": false } 3. 快捷键 ⌨️Zed Editor 的快捷键配置(Key bindings - Zed)以 json/jsonc 作为配置格式,形式如下:[ { "context": "Workspace", "bindings": { } }] context 上下文条件,只有在满足特定的上下文条件下,对应的快捷键绑定才会生效。PaneWorkspaceEditorMenuTerminalAssistantProjectPanelProjectSearchBufferSearchSearchDockEmptyPaneSharedScreenVimControlvim_mode == normalvim_mode == visualvim_mode == insertvim_mode == replacevim_mode == operatorvim_mode == waitingbindings 顾名思义,指定的快捷键;类型可以是字符串、对象、数组。系统默认快捷键打开命令面板 Crtl Shift P,输入 zed: open default keymap,打开默认键位映射文件。自定义快捷键输入 zed: open keymap 来打开 keymap.json 文件,进行自定义修改。[ { "bindings": { "ctrl-shift-p": "command_palette::Toggle", "ctrl-shift-k": "zed::OpenKeymap", "ctrl-shift-x": "zed::Extensions", "f11": "zed::ToggleFullScreen", "ctrl-alt-n": "task::Spawn", "ctrl-alt-r": "task::Rerun", "ctrl-alt-o": "zed::OpenLocalTasks", "ctrl-\\": "workspace::NewCenterTerminal", "ctrl-t": "terminal_panel::ToggleFocus" } }, { "context": "Workspace", "bindings": { "shift shift": "workspace::NewSearch" } }, { "context": "Editor", "bindings": { "ctrl-a": "editor::SelectAll", "ctrl-w": "pane::CloseActiveItem", "alt-enter": "editor::ToggleCodeActions" } }, { "context": "Editor && VimControl && !VimWaiting && !menu", "bindings": { "H": "pane::ActivatePrevItem", "L": "pane::ActivateNextItem", "K": "editor::Hover", "g h": "editor::MoveToBeginningOfLine", "g l": "editor::MoveToEndOfLine", "g b": "pane::GoBack", "g r": "editor::GoToTypeDefinition", "g i": "editor::GoToImplementation", "space c f": "editor::Format", "space c r": "editor::Rename", "space e": "project_panel::ToggleFocus", "space f o": "outline::Toggle", "space f p": "projects::OpenRecent", "space f q": "file_finder::Toggle", "space g [": "editor::GoToPrevHunk", "space g ]": "editor::GoToHunk", "space g b": "editor::ToggleGitBlame", "space g d": "editor::ToggleHunkDiff", "space g r": "editor::RevertSelectedHunks", "space m o": "markdown::OpenPreview", "space m p": "markdown::OpenPreviewToTheSide", "space o": "tab_switcher::Toggle", "space p d": "diagnostics::Deploy", "space w c": "pane::CloseAllItems", "space w k": "pane::SplitUp", "space w j": "pane::SplitDown", "space w h": "pane::SplitLeft", "space w l": "pane::SplitRight" } }, { "context": "ProjectPanel && not_editing", "bindings": { "j": "menu::SelectNext", "k": "menu::SelectPrev", "a": "project_panel::NewFile", "A": "project_panel::NewDirectory", "c": "project_panel::Copy", "d": "project_panel::Delete", "p": "project_panel::Paste", "r": "project_panel::Rename", "x": "project_panel::Cut", "y p": "project_panel::CopyPath", "y r": "project_panel::CopyRelativePath" } }, { "context": "Dock || Terminal || Editor", "bindings": { "ctrl-h": ["workspace::ActivatePaneInDirection", "Left"], "ctrl-l": ["workspace::ActivatePaneInDirection", "Right"], "ctrl-k": ["workspace::ActivatePaneInDirection", "Up"], "ctrl-j": ["workspace::ActivatePaneInDirection", "Down"] } }, { "context": "Terminal", "bindings": { "ctrl-t": "workspace::ToggleBottomDock" } } ] Vim mode 内置打开命令面板 Crtl Shift P,输入 vim: open default keymap,打开 Vim 模式下的默认键位映射文件。内置的 vim-surround 插件,如果你想修改、或者删除单引号和双引号:ds<existing> cs<existing><desired> # 删除以下的[] [1, 2, 3] -> ds[ # 将以下的[]修改为() [1, 2, 3] -> cs[( 内置的 vim-commentary 插件,可视模式下的 gc 和普通模式下的 gcc 起切换注释作用。内置的 netrw 插件,项目面板支持大多数按键绑定。快捷键整理git blame 是 Git 中的一个命令,用于追溯指定文件的历史修改记录。它可以显示文件中每一行代码的最后一次修改信息,包括提交哈希值、作者、日期和时间。 hunk 包含了在某个提交中被添加、删除或修改的行。 [ x 与 ] x 命令利用 Tree-sitter 生成的语法树,使得代码编辑器能够智能地选择代码块,从而提高代码编辑和导航的效率。四、AI 使用 🌟1. Supermaven 智能补全 ✨Supermaven —— The FREE GitHub Copilot Alternative 在 settings.json 文件添加:"features": { "inline_completion_provider": "supermaven" } 点击右下角状态栏中的 Supermaven 图标以登录。2. AI Assistant ⭐👉 Configurating the Assistant Zed editor 支持以下:Zed AIAnthropicGitHub Copilot ChatGoogle AIOllamaOpenAI**Zed AI 目前可以免费使用!!**🎉 👉 Introducing Zed AIZed AI is available now, free during our initial launch period. Sign in to Zed to access an AI-powered assistant panel and inline code transformations that integrate directly with your editing environment.Zed AI brings LLMs directly into your editor with an extensible, text-centric approach. Zed AI 通过可扩展的、以文本为中心的方法将 LLM 直接引入您的编辑器。如何开启Zed AI ?GitHub 帐户登录点击右下角按钮或者快捷键 ctrl ? 打开 AI 助手选择对应的模型点击 Send,同意相关协议即可使用Assistant Panel在助手面板你可以与大语言模型进行互动You: 用户输入的内容或提出的问题。Assistant: AI 助手提供的响应和建议。System: 系统级别的指令或配置,用于设置对话上下文和提供背景信息。👉 命令详情:Commands - ZedInline AssistantInline Assistant 是一种集成在代码编辑器中的实时辅助工具,它通过分析用户的代码和注释,理解用户的编程意图和遇到的具体问题。然后,它根据这些信息提供上下文相关的帮助。这样的集成方式允许开发者无需离开编辑器环境,即可获得必要的帮助,从而提高编程效率。 当你在编辑器中选中代码后,按下 Ctrl + Enter 即可激活 Inline Assistant。这种操作将触发工具对选中代码进行分析,并提供实时的建议或解决方案。这有助于开发者快速解决问题、优化代码或理解某些复杂的编程概念。 总之,Inline Assistant 是一种能够显著提升编程效率的工具,通过无缝集成到代码编辑器中,提供上下文相关的帮助,让开发者更加专注于编写高质量的代码。Prompting点击按钮进入 Prompt Library设置添加 Prompt:👉 Cursor Directory 进行参考在 Assistant Panel 中 输入 /prompt + 自定义 Prompt 即可快速调用!😘五、协作 💥“理想的协作环境应该涵盖整个代码开发的生命周期。” —— 创始人 Nathan协作一直是 Zed Editor 愿景的重要组成部分。从一开始构建 Zed Editor 时就融入了 CRDTs 和文本协同编辑功能。至此编写代码不再是一项孤独的任务,而是一个创造性的、激发思维的过程。 在过去,协作依赖于 Github、屏幕共享、通讯软件等方式,但这会影响你工作的流畅,而你理想中的协作应该始终在代码编辑器中进行,所有操作都集中在此。 👉 Channels - Zed 👉 Collaboration - ZedGitHub 的协作模式感觉像是在发电子邮件,它是异步的信息流,这种方式确实适用于某些情况,所以仍然是一种至关重要的协作方式。六、插件商城 🔌“那么我宁愿拥有一个更快的、扩展更少的 Zed,也不愿让它变成一个臃肿的系统”。—— 创始人 Nathan插件商城中丰富的插件,旨在扩展编辑器的功能,满足不同开发者的需求。 通过右上角头像下拉框中的 Extension 或者使用自定义的快捷键 ctrl shift x,安装需要的插件!! Zed Editor 扩展是被编译打包为 WebAssembly (WASM)。这种设计选择有助于提高扩展的性能和安全性,同时也确保了跨平台兼容性。 ## Publication Information - [Nexseer](https://paragraph.com/@nexseer/): Publication homepage - [All Posts](https://paragraph.com/@nexseer/): More posts from this publication - [RSS Feed](https://api.paragraph.com/blogs/rss/@nexseer): Subscribe to updates