What’s new in Svelte: 2021年8月
おお! Shadow DOM、export と await だ。
Changelog(JS Party Ep. 182)から Svelte Radio(エピソード 29 と 30)まで、今月は Svelte のことを話さずにはいられなかったようですね。また、Svelte では、shadow DOM のサポートと、新たに export や await 機能が追加されました。
New in Svelte
7月は、未解決の PR の数を減らすために本当に努力し、Svelte 3.39.0、3.40.0、3.41.0がリリースされたように、Svelte コアリポジトリにとって2019年後半から最も活発な月でした。大量のバグ修正に加えて、以下の新機能が追加されました。
- イベント修飾子
|trusted
は、イベントが呼び出される前に、そのイベントが信頼できるかどうかをチェックすることができます(#6137)。 - SvelteKit SSR の改善作業をサポートする新しい
svelte/ssr
パッケージです(#6416)。 - TypeScript ファイルの前処理を改善するための新しい
errorMode
コンパイラオプション(#6194)。 - コンポーネント作成時に
target
としてShadowRoot
を指定できるようになり、Svelte コンポーネントを shadow DOM 内でレンダリングできるようになりました(#5869)。 export { ... } from
(#2214)、export let { ... } =
(#5612)と{#await ... then/catch}
(#6270)の構文がすべて Svelte コンポーネントでサポートされました。
機能とバグ修正の全リストは、Svelte の Changelog をご覧ください。
SvelteKit Updates
prerender.force
がprerender.onError
になり、ビルドに失敗するエラーと失敗しないエラーを微調整できるようになりました(#2007)。- esbuild の設定が SvelteKit adapters で使用できるようになりました(#1914)。
- 一般的な設定エラー(#1910)やコンパイラエラー(#1827)のエラーメッセージがより分かりやすくなりました。
- 対象となるホストが SvelteKit アプリケーションと同じか、より特定のサブドメインである場合にのみ Cookie がパスされるようになりました(#1847)。
- より良い imports のために、パッケージング時に index.js の exports がディレクトリの exports に変更されるようになりました(#1905)。
- Vite.js の
mode
が$app/env
から公開されるようになりました(#1789)。 - 全般的に types が向上(#1778、#1791、#1646)。
SvelteKit のすべてのアップデートを確認するには、SvelteKit の Changelog をご覧ください。
Features & bug fixes from around svelte/*
- 言語ツールが “Workplace Trust” 機能をより適切にサポートするようになりました(VS Code の使用において)。
- svelte2tsx では、JS 出力の修正 によって、ambient タイプの宣言の名前が変更され、将来的に宣言が衝突しないようになりました。ユーザーは ambient タイプの定義を自分で提供できることが期待されています。
- Sapper は v0.29.2 をリリースしました。このバージョンでは、正規表現のルート、ディレクトリ要求時のステータスコード、ユーザーが
base
タグを提供していない場合の exports を修正しています(changelog)。
Community Showcase
Apps & Sites
- Parsnip は、モバイルファーストのプログレッシブウェブアプリで、家庭料理を学ぶのに役立ちます。詳しくは、Reddit の記事をご覧ください。
- Central Bank Digital Currency (CBDC) tracker は、世界各国でどのようにデジタル通貨を導入しているかを記録したサイトです。
- Svelte Commerce は、Sveltekit をベースにした、Eコマースのための先進的なフロントエンドプラットフォームです。
- neovimcraft は neovim プラグインに特化した SvelteKit 製サイトです。
Svelte のプロジェクトをお探しですか?ウェブ上での Svelte の存在感を高めることに興味がありますか? SvelteKit での Svelte Society の書き換えに貢献したい方は、未解決の Issue のリストをチェックしてください。
Educational Content
- How I Built a Cross-Platform Desktop Application with Svelte, Redis, and Rust は、Cloudflare 社の Svelte メンテナおよび Developer Advocate である Luke Edwards 氏のブログ記事です。
- How to Create a Blog with SvelteKit and Strapi は、Strapi の Aarnav Pai 氏による段階的なチュートリアルです。
- Sveltekit Markdown Blog は、WebJeda 氏による YouTube のチュートリアルシリーズです。
- Using Custom Elements in Svelte Geoff Rich 氏による Custom Elements の紹介です。
- learn / graphql / svelte は、Hasura の2時間で学べる無料の GraphQL 講座です。
- How to add Magic Link to a SvelteKit application は、もっとも知られているパスワードレスのログインパターンを解説しています。
Libraries, Tools & Components
- Svelte-Capacitor は、v2.0.0 をリリースしました。Svelte と Capacitor を使用して、ネイティブに近いパフォーマンスで iOS と Android 用のハイブリッドモバイルアプリケーションをより簡単に構築することができます。
- svelte-remixicon は、Remix Icon をベースにした Svelte 用のアイコンライブラリで、2000種類以上のアイコンが収録されています。
- SveltePress は、SvelteKit 上に構築されたドキュメントツールです。
- Svelte Starter Kit は、Supabase を利用した Auth と User Profiles により、Svelte を迅速に立ち上げるためのボイラプレートです。
- Kahi UI はダークモードが組み込まれた Svelte 初の UI Kit です。
- typesafe-i18n は、 TypeScript や JavaScript プロジェクトのための、独断的で、完全に型安全な軽量ローカリゼーションライブラリで、外部依存はありません。
コミュニティサイト sveltesociety.dev では、Svelte エコシステム全体からの templates、adders、adapters をご覧いただけます。