惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Cloudbric
Cloudbric
E
Exploit-DB.com RSS Feed
SecWiki News
SecWiki News
Forbes - Security
Forbes - Security
N
News | PayPal Newsroom
S
Security @ Cisco Blogs
Schneier on Security
Schneier on Security
V
V2EX - 技术
S
Secure Thoughts
W
WeLiveSecurity
Google DeepMind News
Google DeepMind News
C
CERT Recently Published Vulnerability Notes
NISL@THU
NISL@THU
S
Securelist
S
Security Archives - TechRepublic
Know Your Adversary
Know Your Adversary
V
Vulnerabilities – Threatpost
Security Latest
Security Latest
Recent Commits to openclaw:main
Recent Commits to openclaw:main
G
GRAHAM CLULEY
H
Hacker News: Front Page
Microsoft Azure Blog
Microsoft Azure Blog
I
Intezer
Google Online Security Blog
Google Online Security Blog
美团技术团队
阮一峰的网络日志
阮一峰的网络日志
T
The Exploit Database - CXSecurity.com
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Webroot Blog
Webroot Blog
Jina AI
Jina AI
Engineering at Meta
Engineering at Meta
P
Proofpoint News Feed
The Cloudflare Blog
I
InfoQ
L
LangChain Blog
U
Unit 42
P
Proofpoint News Feed
S
Schneier on Security
S
Security Affairs
Y
Y Combinator Blog
T
Tenable Blog
N
News and Events Feed by Topic
MyScale Blog
MyScale Blog
量子位
Google DeepMind News
Google DeepMind News
Cyberwarzone
Cyberwarzone
博客园 - 聂微东
D
Darknet – Hacking Tools, Hacker News & Cyber Security
GbyAI
GbyAI
AWS News Blog
AWS News Blog

liseezn'blog

在Zeabur部署Rhex现代论坛 – liseezn'blog Rhex论坛接入DeepSeek 踩坑实录 – liseezn'blog SVGcode 一键部署到 Zeabur – liseezn'blog Edge密码危机自救:1小时的迁移双持方案 – liseezn'blog Token到底是什么意思 – liseezn'blog 使用Next.js重构主页 – liseezn'blog 入手两个4字母域名 – liseezn'blog SEE~Friends 3.4.0 版本更新|从稳定可用,到好用耐用 – liseezn'blog 解决Docker构建PHP8.2+XLoad镜像常见报错,附国内加速+GitHub推送指南 – liseezn'blog SEE~Friends v3.1.0 版本更新|更稳定的友链管理,体验再升级 – liseezn'blog OpenClaw 完整部署+接入OpenRouter全教程(Zeabur平台) – liseezn'blog SeeFriends:一款让你轻松管理友情链接的 WordPress 插件 – liseezn'blog Zeabur 一键部署 OpenClaw 教程(折后最低1.6美元/月) – liseezn'blog Zeabur部署Matomo教程 – liseezn'blog 用certd,5分钟搞定HTTPS证书 – liseezn'blog 开源一款BMI+体脂率综合计算器 – liseezn'blog 学生综合素质评价系统操作教程 – liseezn'blog 轻松迁移网站:使用UpdraftPlus完整教程 – liseezn'blog Steam史低折扣 – liseezn'blog DeepSeek + Xmind:轻松把 PDF、Word 文档转思维导图!pdf/word文档转思维导图 – liseezn'blog Argon主题博客美化 – liseezn'blog 有自己的域名啦 – liseezn'blog LXZCMC我的世界服务器 – liseezn'blog Wordpass_Argon主题安装 – liseezn'blog 我开了属于自己的 MC 服务器:LxZCMC,给每一份热爱一个落脚的方块天地 – liseezn'blog ComfyUI 实战:从安装到生成第一张 AI 绘画 – liseezn'blog n8n 入门:用可视化工作流打造你的专属自动化工具 – liseezn'blog Ollama从入门到进阶:在你的电脑上运行大模型 – liseezn'blog OpenTofu 实战:用开源 IaC 工具一键部署 Docker 应用 – liseezn'blog 强制使用 HTTPS:提升网站安全性 – liseezn'blog 在 lita.eu.org 免费主机上搭建 博客 – liseezn'blog
Zed 编辑器高效配置指南:从安装到打造专属前端工作流 – liseezn'blog
liseeze · 2024-01-19 · via liseezn'blog

本文最后更新于37 天前,其中的信息可能已经过时,如有错误请发送邮件到[email protected]

2024 年 1 月 24 日,由 Atom 原团队打造的下一代代码编辑器 Zed 正式宣布开源。它采用 Rust 编写,天生支持 GPU 加速渲染,主打“极致的性能”和“实时协作”。我第一时间上手体验,并将其配置成了日常开发的主力编辑器。这篇教程将带你从安装开始,一步一步调教出一个高效、美观的 Zed。

· 快得像原生应用:冷启动瞬间完成,滚动 10 万行代码不掉帧。
· 开箱即用的协作:内置 Channels 功能,邀请同伴一起实时编程,延迟极低。
· 极简 UI:没有复杂的菜单栏和标签页,一切通过命令面板和键盘完成。
· 原生 AI 集成:可以直接接入 OpenAI API 或 GitHub Copilot,在编辑器中对话。

安装

前往 zed.dev 下载 macOS 或 Linux 版本。
macOS 用户可以直接 brew install –cask zed。
Windows 用户当时可通过 WSL 或源码编译,官方 Windows 版本也在快速跟进。

安装完成后,首次启动会让你选择主题(我更推荐默认的 One Dark),并引导你登录 GitHub 激活协作功能。

配置核心:settings.json

按下 Cmd+, 或 Ctrl+, 打开配置文件,所有设置集中在一个 JSON 文件中。下面是我自用的配置,可以直接复制使用:

{
  "theme": "One Dark",
  "ui_font_size": 16,
  "buffer_font_size": 15,
  "buffer_font_family": "JetBrains Mono",
  "soft_wrap": "editor_width",
  "autosave": "on_focus_change",
  "tab_size": 2,
  "vim_mode": false,
  "assistant": {
    "enabled": true,
    "default_model": {
      "provider": "openai",
      "name": "gpt-4"
    }
  }
}

· soft_wrap 设置按编辑器宽度自动换行,适合写文章或 Markdown。
· autosave: on_focus_change 让你再也不用担心忘记保存。
· assistant 部分可以填入你自己的 OpenAI API Key(需通过系统环境变量 OPENAI_API_KEY 提供),之后在编辑器中按 Ctrl+Enter 就可以直接和模型对话。

主题与界面微调

Zed 的主题市场非常丰富,直接在命令面板 Cmd+Shift+P 中搜索 theme,可以预览并一键安装。
如果你习惯 VS Code 的图标主题,也可以安装对应的 File Icon 插件。

推荐一个前端开发必备设置:在 settings.json 中增加 “languages” 字段,为不同文件类型指定 tab 和格式:

"languages": {
  "JavaScript": { "tab_size": 2 },
  "TypeScript": { "tab_size": 2 },
  "Python": { "tab_size": 4 }
}

扩展与插件系统

Zed 的插件生态系统刚刚起步,但一些核心功能的扩展已经就绪。比较实用的有:

· Vue / Svelte / Astro 语法高亮:市场内搜索安装即可。
· Tailwind CSS Intellisense:输入类名时自动补全和预览。
· Prettier:保存时自动格式化代码,需配合 Prettier 配置文件使用。

你可以用 Ctrl+Shift+X 浏览插件市场,或者直接在命令面板中 ext install xxx。

AI 辅助编程

除了上面配置的对话助手,Zed 还可以无缝对接 GitHub Copilot。
如果你有 Copilot 订阅,只需在 settings.json 中添加:

"copilot": {
  "enabled": true
}

然后在代码中像使用 Copilot 一样,编写注释或代码片段,等待灰色建议出现,按 Tab 接受。

如果你没有 Copilot,也可以用 OpenAI API 作为替代,体验几乎一致。

多人协作:Channels

这是 Zed 的杀手锏。点击右上角的 Channels 图标,创建一个频道,把链接分享给同伴,对方加入后就可以在同一个编辑会话中实时协作。每个人的光标颜色不同,且支持语音聊天。这个功能非常适合远程结对编程或代码 review。

实际工作流演示

以你正在阅读的博客静态项目(基于 Astro)为例:

· 用 Cmd+O 打开项目文件夹,左侧树状文件视图。
· 在 .astro 文件中编辑,语法高亮和补全都正常工作。
· 写 Markdown 博客时,开启 soft_wrap 模式,舒服得就像在 Typora 里。
· 修改完一个 bug 后,选中代码片段,按 Ctrl+Enter,对 AI 说 “解释这段代码”,直接在编辑器内获得回复。

小结

Zed 并不是要完全取代 VS Code,而是提供了一个极其轻量、极速的选择,尤其适合那些追求专注、不被打断的开发者。经过上述配置,它完全可以成为你写博客、写前端代码的日常利器。