Skip to main content

What's new in Svelte: 2023年1月

SvelteKit 1.0、learn.svelte.dev、そして Svelte elements の型定義

Dani Sandoval

翻訳 : Svelte 日本コミュニティ
原文 : https://svelte.dev/blog/whats-new-in-svelte-january-2023

日本語版は原文をよりよく理解するための参考となることを目的としています。
正確な内容については svelte.dev の原文を参照してください。
日本語訳に誤解を招く内容がある場合は下記のいずれかからお知らせください。

SvelteKit 1.0 のリリースからちょうど2週間が経ちました！ もしまだなら、livestream、新しい web サイト をチェックし、SvelteKit の全機能を段階的に学ぶなら learn.svelte.dev(日本語版: https://learn.svelte.jp/) をチェックしてみてください。

それでは詳細を見ていきましょう…

What's new in SvelteKit

  • @sveltejs/kit 1.0 がリリースされました！今後のリリースは全て semver に準拠し、変更点は CHANGELOG に major/minor/patch としてリストアップされます。
  • Storybook と Histoire のサポートが改善されました (#7990)。これらのツールを完全にサポートするための作業が進行中です (storybook#20239).
  • vitePreprocess がデフォルトのプリプロセッサになりました。vitePreprocess と svelte-preprocess の違いについては ドキュメント をご覧ください (#8036).

Breaking changes:

  • Unknown exports (アンダースコアで始まるものは除く) が +(layout|page)(.server)?.js と +server.js ファイルで行えなくなりました (#7878)
  • __data.json が URL から取り除かれます (#7979)
  • sveltekit() が Vite plugin の配列の promise を返すようになりました (#7994)
  • SvelteKit を埋め込む際に、リンクのクリックをサポートする新しい embedded オプション(デフォルトではオフ)が追加されました (docs, #7969)
  • フォールバックの自動生成は builder.generateFallback(fallback) に置き換わりました (#8013)
  • invalid() は fail() に、ValidationError は ActionFailure に置き換わりました (#8012)
  • 不正な load レスポンスに対し、SvelteKit はエラーをスローするようになりました (#8003)
  • SvelteKit は Vite 4 を使用するようになり、Svelte の peerDependency は ^3.54.0 が必須になりました (#7543)
  • ssr が false で prerender が false でない場合、シェル(Shells)がプリレンダリングされるようになりました。ssr が false の場合、prerender を false にしてください(訳注: これまでと同じ挙動にする場合のみ。詳細は #8131 を参照) (#8131)
  • API の削除や変更に関する警告やエラーが削除されました (#8019)

What's new in Svelte

  • options.direction 引数を、カスタムのトランジション関数に渡せるようになりました (3.54.0, #3918)
  • @const で宣言した関数から、変数を更新できるようになりました (3.54.0, #7843)
  • svelte/elements に、Svelte/HTML の型定義が追加されました (3.55.0, #7649)

What's new in Language Tools

Svelte extension と language tools が要求するミニマムバージョンが新しくなりました:

  • Node のバージョン は 16 になりました
  • TypeScript のバージョンは 4.9 になりました
  • Svelte のバージョンは 3.55 になりました

以下の機能がリリースされました:

  • missing handler quick fix (#1731)
  • add Svelte anchor missing attribute code action (#1730)
  • better commit characters handling (#1742)
  • add --preserveWatchOutput option (#1715)
  • enhance Quickfixes to include Svelte Stores (#1789)
  • only show SvelteKit files context menu in SvelteKit projects (#1771)
  • use the satisfies operator if possible (#1770)

Svelte コンパイラに対する全ての変更については、まだ未リリースの変更も含め、CHANGELOG をご確認ください。

Community Showcase

Apps & Sites built with Svelte

  • Svelte Recipes 🧑‍🍳 provides code snippets for common data visualization problems
  • Everything Svelte is a new course teaching everything you need to know to build a modern web application
  • CSS Timeline is a Timeline of the history and evolution of CSS
  • GitBar is a system tray app for showing your pull requested reviews
  • Texture Lab generates instant textures for games from any text
  • Totems is a studio creating custom-made stands and supports
  • PeopletoNotion is a Chrome Extension that adds LinkedIn profiles to Notion in one click
  • DeckDev is a deck builder for Magic: The Gathering
  • Default Shortcuts is a tool for searching keyboard shortcuts across browsers.

Learning Resources

From Svelte Society

To Watch

To Read

Libraries, Tools & Components

ハッピーニューイヤー 🎆 見落としなどございましたら Reddit や Discord にてお知らせください。