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

推荐订阅源

WordPress大学
WordPress大学
The GitHub Blog
The GitHub Blog
F
Fortinet All Blogs
Cloudbric
Cloudbric
P
Palo Alto Networks Blog
T
Threatpost
T
Tor Project blog
T
Tenable Blog
AWS News Blog
AWS News Blog
Project Zero
Project Zero
L
LangChain Blog
Cyberwarzone
Cyberwarzone
Engineering at Meta
Engineering at Meta
雷峰网
雷峰网
C
CERT Recently Published Vulnerability Notes
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
Security Latest
Security Latest
云风的 BLOG
云风的 BLOG
I
Intezer
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
P
Proofpoint News Feed
A
Arctic Wolf
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Google DeepMind News
Google DeepMind News
V
Vulnerabilities – Threatpost
C
Cybersecurity and Infrastructure Security Agency CISA
MongoDB | Blog
MongoDB | Blog
aimingoo的专栏
aimingoo的专栏
K
Kaspersky official blog
Jina AI
Jina AI
N
News | PayPal Newsroom
T
The Blog of Author Tim Ferriss
D
DataBreaches.Net
A
About on SuperTechFans
博客园 - 三生石上(FineUI控件)
博客园 - 【当耐特】
Hugging Face - Blog
Hugging Face - Blog
Recorded Future
Recorded Future
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
S
Secure Thoughts
TaoSecurity Blog
TaoSecurity Blog
P
Privacy & Cybersecurity Law Blog
P
Proofpoint News Feed
MyScale Blog
MyScale Blog
IT之家
IT之家
Forbes - Security
Forbes - Security
The Hacker News
The Hacker News
Last Week in AI
Last Week in AI
T
Threat Research - Cisco Blogs
Y
Y Combinator Blog

编辑器 – 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,而是提供了一个极其轻量、极速的选择,尤其适合那些追求专注、不被打断的开发者。经过上述配置,它完全可以成为你写博客、写前端代码的日常利器。