Svelte 的更新内容：2023年8月

本月，Svelte 和 SvelteKit 都发布了一些令人兴奋的新功能。同时，也很高兴看到有这么多产品和侧项目使用 Svelte 作为核心技术推出！

更多内容见下文…

Svelte 和语言工具的新内容

自 Svelte 4 发布以来，已经修复了许多小 bug。你可以在 CHANGELOG 中找到它们。

4.1.0 版本增加了对封装底层 Svelte 组件的自定义元素类进行进一步自定义的能力。查看 Custom Elements API 文档或相关 PR 了解更多信息！

除了支持 SvelteKit 的新 HEAD 服务器方法，Svelte 的语言工具现在还支持 Prettier v3 (extensions-107.9.0)，并且现在使用工作区信任设置来支持工作区中的所有设置 (extensions-107.8.0)。

SvelteKit 的新内容

• HEAD 服务器方法现在可用于 API 路由 (1.22.0，文档，#9753)。
• 带有 Vary 头的响应现在也会被缓存（除了 Vary: *）(1.22.0，文档，#9993)。
• 如果 SvelteKit 的构建输出不存在，现在预览时会显示更有帮助的错误 (1.22.2，#10337)。

本月的所有补丁和性能更新，请查看 SvelteKit CHANGELOG。你还可以在每个 adapter 目录 中找到适配器的专用 CHANGELOG。

---

社区展示

使用 Svelte 构建的应用和网站

• GitLight 将 GitHub 和 GitLab 的通知带到你的桌面。
• Days 是 paprikka 的生活天数可视化，灵感来自 Buster Benson 的《按周划分的生活》。
• Mofi 是一个内容感知的音乐填充和裁剪工具。
• JSON Bucket 存储你的 JSON 数据，以便可以通过生成的 API 路由随时随地访问。
• Soggy Planet 是一个互动地球地图，展示海平面升降与夜晚文明灯光的变化（源码）。
• PaperClip 是一款 Chrome 扩展，方便记忆机器学习、计算机视觉和自然语言处理中论文的细节。
• Maktaba 是一个“你会真正使用的”书签管理器。
• Whispering 是一个 Chrome 扩展，可以快速在浏览器中使用 OpenAI 的 Whisper API 进行转录（包括 ChatGPT）。
• DocuTalk 是一个为你的网站提供 AI 客服聊天机器人的服务。
• Krello 是一个使用 Svelte、Appwrite 和 Flowbite 构建的 Trello 克隆。
• Been 是一个旅行数据地图生成器，显示已访问的国家、极端访问点等统计数据。
• image-to-social-media-thumbnail 可将任何图片转换为社交媒体缩略图。
• Svelte Capacitor Store 是一个持久化存储工具，在原生设备上使用 Capacitor 的存储偏好，在其他情况下使用 localStorage，非常适合多平台项目。

学习资源

汇集 Svelte 贡献者和大使

• 探索 Svelte 4 w/ Kevin AK: 性能、兼容性 和 Web 组件支持 | Modern Web Pod，来自 This Dot Media。
• Svelte Sirens 流设计系统：学习经验，主讲：Eric Liu，Carbon Components Svelte 和 sveld 文档生成库的创建者。
• 本周 Svelte：
  • 2023年6月30日 - Svelte 4.0.1，SK 1.21，列表，屏幕阅读器，加载过程
  • 2023年7月7日 - Svelte 4.0.5，Kit 1.22.1，Svelte 5，本地存储和 markdown
  • 2023年7月21日 - Svelte 4.1.1，SvelteKit 1.22.3，渐进增强

观看/收听

• 什么是过渡式 Web？来自 Chris Ferdinandi 的探讨，Smashing Podcast。
• 100秒看懂 SvelteKit，来自 Fireship。
• Primo V2 介绍，来自 Primo（一个基于 Svelte 的 可视化 CMS）。
• 理解 Svelte（对比 React），来自 Kodaps Academy。
• 真的有那么简单吗？- 掌握 SvelteKit，来自 Threeveloper。
• 使用自定义组件在 SvelteKit 中实现 Markdown：mdsvex，by hartenfellerdev。
• 如何为 Svelte 和 SvelteKit 增添彩带 🎉 和 用 Rust 和 WebAssembly 提升 SvelteKit 代码速度，来自 SvelteRust。

阅读

• SvelteJS：我的生态系统比你的更大，作者 roguegpu。
• 在 SvelteKit 中避免共享状态，作者 Aakash Goplani。
• SvelteKit Fontaine：减少自定义字体 CLS，作者 Rodney Lab。
• 在 Svelte Kit 中实现重定向的简单指南，作者 Justin Golden。
• React vs Svelte (2023年第三季度)，作者 Gee。
• SvelteKit 页面反应组件与 Upstash Redis，作者 Scott Spence。
• 用 SvelteKit 构建隐私友好的自托管应用架构，作者 Stanislav Khromov。
• 在 IIS 上部署 Sveltekit，作者 Nutchapon Makelai。
• 简化身份验证和机密管理，作者 Eman。

库、工具与组件

• Melt UI 是一组为 Svelte 提供的无头、可访问的组件构建工具。
• MDsveX 已更新，可与 Svelte 4 兼容。
• Svelte Sonner 是一个表意明确的 Svelte 提示组件。
• WebExtensionTemplate 让你跳过样板代码，用 TypeScript 和 Svelte 或 React 编写 Web 扩展。
• svelte-rust 允许你在 Svelte 应用中运行 Rust 代码。
• SvelteKit SSE 提供了一种生成和消费服务器发送事件的简便方式。
• better-svelte-writable 提供了一种类型安全的可写对象，让你对容器有更多控制。
• Svetch.ts 是一个用于 API 端点的客户端/类型/架构/文档生成工具。
• sveltekit-localize-url 处理 URL 本地化和路由。
• elegua 是为 Svelte 提供的小型、响应式 PWA 路由器。
• Molly 是一个 bash 脚本和 npm 模块，帮助清理项目中未使用的 Svelte 组件。
• sveltekit-bot 是一个使用 SvelteKit 和 Vercel 构建的 Telegram 机器人。

感谢阅读！一如既往，如果漏掉了什么，请随时在 Reddit 或 Discord 上告诉我们。

下次见 👋