跳至主要内容

Svelte 2022年5月更新

使用<svelte:element>动态切换 HTML 元素类型

Dani Sandoval

昨天的 Svelte 峰会刚刚结束，我们有很多新闻要分享！在Svelte Society YouTube 频道查看所有录制内容，并查看本月剩余时间的更新......

Svelte 的新功能

  • <svelte:element> 元素允许你渲染动态指定类型的元素。例如，这在从 CMS 渲染富文本内容时很有用。查看文档或教程了解更多信息（**3.47.0**）！

语言工具更新

  • 现在支持 svelte:element 和 sveltekit:reload
  • 现在会自动检测无效的 Svelte 导入路径 - 请参阅 PR 以获取旧行为（#1448）
  • source.sortImports 允许你排序导入，而无需删除未使用的导入（#1338）
  • 将鼠标悬停在 HTML 属性上现在会显示 HTML 悬停信息，而不是 TS 悬停信息 - 从而提供更有用的信息（#1447）
  • 在 VS Code 中，你现在可以使用“插入代码段”命令将现有代码块包装在控制流标签中（#1373）

SvelteKit 的新功能

  • 现在可以在 routes 目录中将文件和目录命名为 __tests__ 和 __test__（#4438）
  • 现在支持 Netlify Edge Functions（#4657）和 Vercel 构建输出 API（#4663）
  • 加载路由时，现在可以使用自定义 load 依赖项（表示页面依赖的 URL 的字符串数组）（文档，#4536）

重大更改

  • 验证器现在称为“匹配器”（文档，#4358）
  • __layout.reset 已被命名布局取代 - 命名布局为共享布局元素提供了更多配置选项（文档，#4388）
  • 现在跳过 rel="external" 链接的预渲染（#4545）
  • maxage 现在在 LoadOutput 中为 cache（#4690）

社区展示

使用 Svelte 构建的应用和网站

  • polySpectra AR 允许你使用无缝的 AR 文件传递更快地创建 3D 打印原型（视频演示）
  • Pixel Art Together 是一个由 Liveblocks 提供支持的免费多人像素艺术编辑器
  • Tooling Manager 允许你将你的 JavaScript 技术栈与行业标准样板进行比较
  • Easy Portfolio 根据你的 GitHub 个人资料生成投资组合
  • FLOAT 是一个用于活动的考勤跟踪程序
  • The Coin Perspective 是一个加密货币价格跟踪器和投资组合管理工具
  • Locutionis 是一个小型在线修辞格参考（法语）
  • ASM Editor 是一个用于 M68K 和 MIPS 的多合一 Web 编辑器
  • Otium 是一款免费且开源的图书管理和书架整理工具，可帮助你管理你的书籍和你想阅读的书籍
  • Sinwaver 是一个 SVG 正弦波生成器

想要为一个现代的 SvelteKit 网站做出贡献吗？帮助构建 Svelte Society 网站！

学习资源

阅读

观看或收听

库、工具和组件

  • KitDocs 是 SvelteKit 的文档集成 - 类似于 Svelte 的 VitePress。
  • Svelte Copy 是一个点击/轻触复制库，使复制到剪贴板变得容易
  • Svend3r 提供了美丽的可视化效果，利用 D3 的强大功能，将你的数据栩栩如生，同时抽象掉其命令式代码
  • Svelte Hamburgers 是一个易于使用的 Svelte 汉堡菜单组件
  • Svelte Droplet 是一个用于 Svelte 的文件拖放区
  • Svelte MP3 是一个用于 Svelte 的轻量级、极速且简单的极简音频播放器
  • SvelteUI 是一个组件库，用于比以往更快地构建功能齐全且可访问的 Web 应用程序
  • svelte-spotlight 是一个无头聚光灯组件，可帮助你在几分钟内构建网站的全局搜索框
  • svelte-pdf-simple 是一个简单的 svelte 库，用于显示 PDF 并提供所有控制权
  • persistent-svelte-store 是一个通用的持久可写存储，根据 Svelte 存储约定从头开始使用 TypeScript 构建
  • svelte-exmarkdown 是 Svelte 组件，用于动态渲染 Markdown
  • Bookit 是一个类似 Storybook 的组件渲染环境 - 精心调整以直接在你的 SvelteKit 项目中工作

加入我们在Reddit或Discord继续对话。

如果你想亲自加入我们，Svelte 峰会终于正在过渡到现实世界。加入我们，参加两天精彩的 Svelte 内容！立即获取门票！

下个月见！