Svelte 最新消息：2021 年 1 月

Svelte 祝大家新年快樂！在上個月，我們在 Sapper 即將發布的版本上取得了進展，微調了我們的 SvelteComponent 類型定義，並且在展示中看到了一些令人驚嘆的應用程式、網站和函式庫。

Svelte 有哪些變更？

一個新的次要版本用 SvelteComponentTyped 類別取代了 SvelteComponent 類別。這個重新命名應該有助於向後相容性。我們已更新上個月的部落格文章，以避免任何名稱變更造成的混淆。

如果您在專案或函式庫中使用 SvelteComponent 或新的 SvelteComponentTyped，請告訴我們您使用它的目的，我們會將其添加到展示中！

Sapper 的進展如何？

更多提升生活品質的功能每天都在即將發布的版本中推出。 0.29.0 將包含新的 TypeScript 定義、對捲動追蹤和預先擷取行為的修正，以及對執行時期路由器的改進，以支援編碼的查詢參數。

如果您是從 0.28.x 升級，請查看遷移指南，以了解更新至 Sapper 0.29 的步驟。

SvelteKit 準備好了嗎？

為了避免開發期間產生過多的變動，SvelteKit 仍在一個私有儲存庫中進行開發。當它準備好讓更多使用者和貢獻者使用時，將會在 Discord、部落格和 Twitter 上發布公告。

同時，您可以從命令列執行 npm init svelte@next 來探索目前的建置。

正如在SvelteKit 到底是什麼？中所警告的那樣，目前還沒有可用的文件或支援... 因此請自行承擔風險使用 / 自娛自樂！

---

社群展示

應用程式和網站

• manitu.me 是一個用於專注和放鬆的背景聲音 / 番茄鐘計時器
• Answer Socrates 可協助您在網路上找到熱門問題，以便您撰寫最相關的部落格文章、推文或廣告看板
• multris 是一款多人 Tetris 遊戲。您可以在這裡閱讀其開發過程
• weather-ab 比較世界各地不同城市的氣象檔案。對於考慮移民的人來說不可或缺
• Game Nibs 是一個讓遊戲玩家尋找和分享簡潔的遊戲建議、提示、技巧、螢幕截圖、組建等等的平台
• Ora 是一個用於 Chrome 和 Firefox 的開源網站追蹤和限制工具
• vscode-dms 是一個用於 VSCode 的群組直接訊息聊天應用程式
• Zero.2 是一款以數學為基礎的挑戰遊戲，您必須盡快歸零
• Octave Compass 是一個適用於許多流行音樂音階的和弦表和音階探索器
• Infinite Walking Bass Generator 2 是一個線上音樂播放器，可產生獨特的步行低音線
• ListenAddict 是一個網站，會在有人在 Podcast 上發布新的演講/訪談時通知您

示範、函式庫和元件

• svelte-tiny-virtual-list 透過僅渲染可見項目來加速長列表
• svelte-query 是一組有用的 Hook，用於管理、快取和同步非同步和遠端資料
• svelte-previous 是一個 Svelte 儲存，用於記住先前的值 - 對於轉換或快速復原堆疊很有幫助
• 讓我們建立一個紙花砲說明如何建立一個粒子系統，並將基於 Canvas 的動畫整合到較大的應用程式中
• svelte-micro 是一個單一元件路由器
• svelte-standalone-router 是一個獨立路由器，其 API 基於 standalone-router
• svelte-datepicker 是一個日期選擇器元件，具有時間選擇、日期範圍和響應式主題的變體
• svelte-slimscroll 是一個適用於 Svelte.js 的 Action，可將任何 div 轉換為具有良好捲軸的捲動區域。
• Svelte Zoomable 是一種具有良好縮放效果的自訂轉換

有想要分享的元件嗎？在 Svelte Society 網站上的套件清單中，提交您自己的元件。

學習資源

• 使用 Svelte 建立捲動影片效果展示了如何使用 bind 命令來建立具有少量程式碼的酷炫捲動影片效果
• 如何在 Svelte 和 Typescript 中製作 Flappy Bird 遊戲是一個包含文件和程式碼以供參考的影片教學
• 可存取的 Svelte 轉換逐步講解 prefers-reduced-motion，使 Svelte 轉換更具可存取性
• Svelte 的模組腳本解釋是對模組環境（一種常見的 Sapper 模式）的絕佳介紹
• Awesome Svelte 是一個 Svelte 資源的精選列表
• .NET Core 和 Svelte 說明如何使用 .NET Core 啟動並執行 Svelte
• A la découverte de Svelte JS 是一個法語 Svelte 教學系列！
• 給 React 開發人員的 Svelte 向習慣使用 React 的人解釋了 Svelte 的核心概念
• 使用流暢的頁面轉換建置 Svelte 靜態網站展示如何使用 Svelte 建置靜態網站，並使用 Three.js 和 GSAP 新增流暢的頁面轉換。
• 在 Sapper 中使用 Apollo Client 解釋了將 Apollo 查詢客戶端整合到 Sapper 的「最簡單」解決方案
• 使用 Crystal + Svelte 的反應式 Web 應用程式探索如何使用 Crystal 後端建置全堆疊、伺服器渲染的 Svelte 應用程式

相關專案

• Snowpack 的 v3 候選版本現已發布，為 1 月 6 日的發布日期做準備。請查看Svelte 入門，以取得有關如何使用 Snowpack 的更多資訊。
• 開源檔案上傳器 Uppy 在其新版本 1.24 中宣布支援 Svelte

下個月見！

想要將您的作品添加到展示中嗎？想要為 Svelte 貢獻一份力量嗎？請查看Svelte Society、Reddit 和 Discord 以參與其中！