Skip to main content

What's new in Svelte: 2021年8月

おお！ Shadow DOM、export と await だ。

Dani Sandoval

翻訳 : Svelte日本コミュニティ 原文 : https://svelte.dev/blog/sveltekit-beta

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

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

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 をご覧いただけます。

See you next month!

もっと更新情報が欲しいですか？ Reddit or Discord に参加してください！