Svelte 2022年3月更新
Svelte Summit 春季即将到来……页面端点也已上线!
刚刚宣布:Svelte Summit 春季将于2022年4月30日举行。第五届 Svelte 虚拟大会正在招募演讲嘉宾和赞助商……是时候拿出你的提案了!
此外,本月还向 SvelteKit 添加了一些长期以来备受期待的功能……包括页面端点!这种 load
函数的工作方式变化使得获取基本页面所需的数据、从 POST 响应重定向以及处理 404 和其他错误变得更加容易。
更多关于此功能以及其他新功能和修复程序,请参见下文!
SvelteKit 的新功能
- 文档现在支持搜索,并且可以进行多页面浏览,并提供类型定义和可悬停的代码示例 - 请访问svelte.dev/docs/kit查看。
- 页面端点显著减少了加载页面所需的样板代码 (问题,PR,文档)
- 应用程序版本控制和更新检测支持允许您在应用程序更新后路由加载失败时确定要执行的操作 (问题,PR,文档)
npm init svelte@next
中的新选项现在将自动设置 Playwright 以进行测试 (PR)
重大更改
target
选项不再可用。取而代之的是,init
脚本会对其parentNode
进行水合 (#3674)- 应用程序级类型现在位于
App
命名空间中,这允许您为全局类型(如Stuff
或Session
)指定类型 (#3670) JSONString
现在为JSONValue
(#3683)createIndexFiles
已移除 - 现在由trailingSlash
选项控制 (#3801)- SvelteKit 将不再从预渲染中排除根相关的外部链接,如果这些 URL 旨在由单独的应用程序提供服务,这将导致 404 错误。如果您需要忽略它们,请使用自定义的
prerender.onError
处理程序 (#3826)
语言工具中的新功能
社区展示
应用和网站
- SvelteStorm 专为 Svelte 开发人员提供构建 Svelte 应用程序所需的所有必要工具。
- Supachat 是一个使用 Svelte 和 Supabase 构建的实时聊天应用程序。
- Radicle 是一个用于协作构建软件的点对点栈。
- The Making Known 是对纳粹德国政府为与二战期间被占领的比利时、法国和卢森堡进行沟通而设计的宣传海报的叙述性体验。
- Svelte Kanban 是一个使用纯 CSS 构建的简单 Svelte Kanban 板。
- fngrng 是一款专注于准确性而非速度的打字训练器。
- 生成网格 是 Svelte REPL 中一个简洁的小型生成 SVG 网格,具有随机生成的调色板和形状。
- LifeHash 是一种散列可视化方法,可以创建精美、确定性的图标。
- TypedWebhook.tools 是一个用于检查有效负载的 Webhook 测试工具,具有自动类型生成功能。
- Speedskating 是一个动画组件,用于显示奥运会速度滑冰比赛。使用 Svelte、D3 和 regl 构建。
- Web tail 是一个 Web 应用程序,用于查看本地系统或远程服务器上的文件行。
想与他人一起开发 SvelteKit 网站?为 Svelte Society 网站做出贡献!
学习资源
阅读
- 将 Svelte 组件用作 Web 组件 作者:Matias Meno
- 使用响应式 URL 进行简单的 Svelte 路由 作者:Bjorn Lu
- 通过特色视频和语法高亮改进我的 Sveltekit/Sanity.io 博客内容 作者:Ryan Boddy
- 此博客如何充分利用 GitHub 作者:paullj
- 全栈 JWT 身份验证:介绍 SvelteKit 作者:John Idogun
- Svelte-Cubed:为 3D 场景添加运动 作者:Alex Warnes
- 使用 Sanity 和 Svelte Kit 创建 RSS Feed 作者:GHOST
- 如何使用 Svelte 的 style 指令 作者:Geoff Rich
- SvelteKit 和“客户端模式” 作者:Julian Laubstein
观看
ShadowSvelte Kit 中的页面端点 - 每周 Svelte 作者:LevelUpTuts- 初学者测试(播放列表) 作者:Joy of Code
- KitQL - GraphQL 的原生 SvelteKit 库 作者:Jean-Yves COUËT
库、工具和组件
- gosvelte 是一个概念验证,用于在 GoLang HTTP 服务器上提供 Svelte 生成的页面,服务器数据作为道具发送到 Svelte 组件。
- svelte-ethers-store 使用 ethers.js 库作为 Svelte、Sapper 或 SvelteKit 的可读 Svelte 存储的集合。
- Fluid Grid 是面向未来 Web 的 CSS 网格系统。
- stirstack 是一个结合了 Svelte.js、TailwindCSS、InertiaJS 和 Ruby on Rails 的有见地的框架。
- OATHqr 帮助用户创建用于 2FA/MFA 和其他支持 OATH 的应用程序的安全凭据。使用它可以为一次性密码身份验证器应用程序(如 Aegis 或 YubiKey)生成可扫描的 QR 码。
- svelte-GridTiles 是一个基于响应式网格构建的拖放可调整大小的磁贴库。
- 各种 Svelte 组件 是 alex-knyaz 在我的项目中经常使用的各种 Svelte 组件的集合。
- walk-and-graph-svelte-components 是一个 CLI 节点脚本,用于遍历 Svelte 和 js 文件,以绘制依赖项(即“导入”)的精美 JPG 图。
- Felte 是一个易于使用的 Svelte 表单库。
- svelte-use-tooltip 是一个用于显示工具提示的 Svelte 操作。
- persistent-svelte-store 是一个通用的持久化可写存储,根据 Svelte 存储约定从头开始使用 TypeScript 构建。
我们错过了什么?加入我们的Reddit或Discord社区,继续讨论。
下个月见!