npm create svelteでプロジェクトを作成する
公式CLIを使用して新しいSvelteKitプロジェクトをひな形から作成し、適切なオプションを選択します。
「npm create svelteでプロジェクトを作成する」はCoddyKit上の無料Sveltejs Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはSveltejs Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Sveltejs Academyコースには全4レッスンが含まれています。
プロジェクト生成ツール
SvelteKitプロジェクトを始める公式の方法は、npm create svelte@latestコマンドを使うことです。実行可能な状態のアプリが生成されます。
npm create svelte@latest my-appウィザードで尋ねられる項目
テンプレート（skeleton、demo app）、TypeScriptのサポート、ツール（ESLint、Prettier、Playwright、Vitest）について尋ねられます。
テンプレートの選択肢
Skeletonプロジェクトは最小限の構成を提供します。Demoアプリには、学習用の小さなSverdleゲームの例が含まれています。
TypeScriptの選択
型安全性が必要な場合は、TypeScriptで「Yes」を選択してください。ウィザードによってTS設定が用意され、scriptブロックではlang="ts"が使用されます。
依存関係のインストール
ウィザードが完了したら、ディレクトリを移動してパッケージをインストールします。
cd my-app
npm install開発サーバーの起動
devスクリプトを使って、ホットリロード対応のサーバーをhttp://localhost:5173で起動します。
npm run devブラウザーで開く
ターミナルに表示されたURLにアクセスしてください。ウェルカムページが表示されます。src/routes/+page.svelteを編集し、変更がリアルタイムで反映されることを確認しましょう。
プロダクションビルド
buildスクリプトはコンパイラーを実行し、配信可能な出力ディレクトリを生成します。
npm run build
npm run previewパッケージマネージャーの選択
npm、pnpm、yarnを使用できます。pnpmは、ディスク使用効率と厳密な解決で人気があります。
エディターのセットアップ
.svelteファイルで構文ハイライト、IntelliSense、診断機能を利用するには、Svelte for VS Code拡張機能をインストールしてください。
Git初期化の選択
ウィザードでは、gitリポジトリを初期化するかどうかを選択できます。「Yes」を選ぶと、適切な.gitignoreファイルが追加されます。
クイックチェック
新しいSvelteKitプロジェクトを作成するコマンドはどれですか。
おさらい
これで、プロジェクトのひな形を作成し、TypeScriptとツールを選択し、依存関係をインストールして、devまたはbuildスクリプトを実行できるようになりました。
よくある質問
「npm create svelteでプロジェクトを作成する」レッスンは無料ですか？
はい。「npm create svelteでプロジェクトを作成する」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Sveltejs Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Sveltejs Academyコースには全4レッスンが含まれています。
「npm create svelteでプロジェクトを作成する」で何を学びますか？
公式CLIを使用して新しいSvelteKitプロジェクトをひな形から作成し、適切なオプションを選択します。 ブラウザで直接実行するハンズオンコードでSveltejs Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Sveltejs Academyを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのSveltejs Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。
「npm create svelteでプロジェクトを作成する」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このSveltejs Academyレッスンでコードを書いて実行できますか？
はい。すべてのSveltejs Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- Svelteとは何か、なぜコンパイルするのか
- npm create svelteでプロジェクトを作成する
- プロジェクト構成：src、routes、static
- 開発サーバーとHot Module Replacement