Svelte 新闻：2023 年 5 月

在深入了解更新之前，有一些公告值得在开头提及

新的 Svelte 大使

本新闻稿的常规功能以及 Svelte 的全方位优秀内容创作者 JoyOfCode 和 HuntaByte 已被任命为 Svelte 大使。大使是因其乐于助人和贡献以及维护 Svelte 作为友好、热情社区的声誉而闻名的人，我们对其参与表示衷心的感谢！

SvelteHack 获奖者将于 5 月 6 日公布

就在几天后，我们将找出谁赢得了 SvelteHack - 于 2 月 17 日至 4 月 17 日举行的 Svelte 黑客马拉松。请于 5 月 6 日收看 Svelte Summit，看看您最喜欢的项目是否入选 👀

本月展示的众多黑客马拉松提交作品……但首先，让我们看看有什么新内容！

Svelte 的新功能

• style 块现在支持 CSS @container 查询 (**3.58.0**)
• bind:innerText 现在可用于 contenteditable 元素 (**3.58.0**)
• 一个新的可访问性警告 a11y-interactive-supports-focus 现在将在交互式元素不可聚焦时发出警告 (**3.58.0**)

有关 Svelte 编译器的所有更改，包括未发布的更改，请查看 CHANGELOG。

SvelteKit 的新功能

• 启用热模块替换 (HMR) 后，修复错误后页面将重新加载 (**1.14.0**，#9497)
• 现在可以在“嵌入”模式下同时加载加载到同一 html 页面中的两个应用程序 (**1.15.7**，#9610)
• Vite 的编译现在将记录使用 svelte 字段以与标准 Vite 解析不同的方式解析 Svelte 文件的软件包的警告 (**[email protected]**，**[email protected]**)

语言工具的新功能

• 支持 <svelte:document> (#1958) 和新绑定的 intellisense 报告 (#1957) (**107.3.0**)
• “快速修复...”的新修复全部菜单选项使“添加所有缺少的导入”和其他检测到的错误变得容易 (**107.3.0**，#1939)
• 我们有一个新的、更好的官方 ESLint 插件！以前对 ESLint 中 Svelte 的支持没有很好地处理模板 AST，导致误报/漏报以及自定义 ESLint 规则的高障碍。这个新的官方版本基于 ota-meshi 的 svelte-eslint-parser，并已准备好投入使用。试一试并 分享您的反馈！

---

社区展示

使用 Svelte 构建的应用程序和网站

• 战争之声 是一项叙事数据可视化项目，旨在帮助了解乌克兰破坏的规模
• Syntax FM 的商品商店 现在使用 SvelteKit、PlanetScale 和 Prisma 构建
• 感谢罐 是您自己的私人空间，您可以在其中向您的伴侣发送鼓励和感谢的信息
• 日语高手 是一款日语声音和符号学习应用程序
• MarkMyImages 是一款用于批量水印、图像调整大小、重命名、效果等的工具 - 所有这些都在设备上进行，以提高速度和隐私
• Immich 是一款自托管的照片和视频备份解决方案，可直接从您的手机备份
• Earbetter 是一款用于演奏和编程音乐和音频的耳部训练游戏和工具
• Tune Twisters 是一款歌曲猜谜游戏……倒着猜
• ResponseHunt 是一款基于浏览器请求的神秘游戏 - 使用您的编程技能获取“黄金”响应
• Wolfensvelte 3D 是 Wolfenstein 3D 的 Svelte “移植版”
• 代码求解 教授如何用代码解决问题
• 制作书签 是一种快速创建 JavaScript 书签的方法，具有 lint、智能感知和自动缩小功能
• GeniePM 是一款 AI 工具，可帮助产品经理编写用户故事和需求
• 一口大小的新闻 是一款 AI，可以通过聊天提供新闻摘要并回答问题
• 开放调音 是一个探索替代吉他调音的地方，而无需重新调音您的吉他
• BlinkSMS 是一款斯德哥尔摩学生住房的短信提醒工具，有助于预订洗衣时间
• 开发人员链接 帮助开发人员在一个地方展示多个链接 - 类似于 Linktree 和 Kofi
• Audiogest 是一款将语音转换为文本并总结任何音频的工具
• 扫雷 是使用 Svelte 和 JavaScript 构建的扫雷游戏的演绎
• Biolytics 允许您导入您的实验室测试，以便在一个地方查看所有实验室测试
• 零共享 是一种使用 WebRTC 的安全 P2P 文件共享
• Svelte 实验室 是一个用于创建和共享 SvelteKit 项目的沙盒

学习资源

以 Svelte 贡献者和大使为特色

• 开发博客：2023 年 4 月 - TypeScript 与 JSDoc、过渡 API、Dominic Gannaway 加入 Svelte 团队
• Rich Harris 谈框架、网络和边缘。 来自 Vercel 在纽约市的 Svelte 聚会
• Svelte 和 SvelteKit 由 Rich Harris 在 Frontend Masters 上教授
• 本周的 Svelte
  • 2023 年 3 月 31 日 - SvelteKit、Svelte；静态站点和无头 CMS 演示
  • 2023 年 4 月 22 日 - SvelteKit 1.15.7、跳过链接、错误处理、静态资产
  • 2023 年 4 月 14 日 - SvelteKit 1.15.5、可访问按钮、高级切换状态 🧪🔥
  • 2023 年 4 月 21 日 - SvelteKit 1.15.7、跳过链接、错误处理、静态资产
• Svelte 电台
  • 与 Puru Vijay 一起在 React 中使用 Svelte
  • Eric Brehault 和 Nuclia
  • Alex Patterson 在 AppWrite 中使用 Svelte
  • 达特茅斯学院的 Svelte 研究与 Wasita 和 Eshin

观看

• 构建现代 Web 应用程序的完整 SvelteKit 课程 和 简单的 SvelteKit 页面过渡 由 Joy of Code 制作
• 适用于 React 开发人员的 Svelte | 您的下一个 JavaScript 框架？ 由 Cretezy 制作
• Svelte 和 SvelteKit：完整指南 由 Ali Alaa 在 Udemy 上制作
• 带 SvelteKit 的 ChatGPT-4 🤖 边缘上的生成式 AI 🌍 由 Johnny Magrippis 制作

阅读

• 使用 GraphQL 和 SvelteKit 的无头 WordPress 和 如何在 SvelteKit 中修复重复元标记问题 由 Justin Ahinon 制作
• 如何在 SvelteKit 项目中设置 tRPC 由 Raqueebuddin Aziz 制作
• 使用 Svelte 构建更好的数据可视化 由 newline 制作
• 带 SvelteKit + SQLite 的离线应用程序第 1 部分：设置 WebAssembly SQLite 由 hartenfellerdev 制作

库、工具和组件

• Sveltris 允许您在框架之间混合使用 UI 原语（如组件）和状态原语（如钩子），甚至不会注意到
• SwiftMarket 是一款使用 SvelteKit、Pocketbase 作为数据库和 Stripe 作为支付方式构建的电子商务解决方案
• Svelegante 是 Svelte 的一个优雅的可写存储
• 表格生成器 允许您使用图形编辑器在线创建、设计和自定义自己的表格
• Svelte 动画标题 是一款动画标题组件，可以以信息化的方式吸引注意力
• SvelteKit 音乐应用程序示例 演示了如何连接和处理数据，以及一些关于如何使用 TailwindCSS 开发前端组件的实用示例
• Socio 是一个 WebSocket 实时通信 (RTC) API 框架，用于将您的前端逻辑以响应方式连接到后端数据库
• Flowbite Svelte 是 Svelte 的官方 Flowbite 组件库
• Wundergraph，一个前端框架的后端，刚刚发布了他们的 Svelte Query 客户端
• Lucia 刚刚发布了其适用于 SvelteKit 的简单灵活的认证库的 1.0 版本
• svelte-stepper 是一个用于使用 Svelte 构建动画分步流程的简单库

与往常一样，如果您在 Reddit 或 Discord 上发现我们错过了任何内容，请告诉我们。

下次再见！