[Svelte] 初めて試してみる

Svelte 公式ドキュメントに合わせて、インストールして開くところまでを試します。

my-svelte-app は作成するフォルダ名となるので、必要であれば変更します。

npm create svelt@latest my-svelte-app

いくつか質問がありますが、下記のように選択してみます。

> npm create svelte@latest my-svelte-app

create-svelte version 6.0.5

┌  Welcome to SvelteKit!
│
◆  Which Svelte app template?
│  ● SvelteKit demo app (A demo app showcasing some of the features of SvelteKit - play a word guessing game that works without JavaScript!)
│  ○ Skeleton project
│  ○ Library project
└
◆  Add type checking with TypeScript?
│  ● Yes, using JavaScript with JSDoc comments
│  ○ Yes, using TypeScript syntax
│  ○ No
└
◆  Select additional options (use arrow keys/space bar)
│  ◻ Add ESLint for code linting
│  ◻ Add Prettier for code formatting
│  ◻ Add Playwright for browser testing
│  ◻ Add Vitest for unit testing
│  ◻ Try the Svelte 5 preview (unstable!)
└

完了すると、Next steps などが表示されます。

> npm create svelte@latest my-svelte-app

create-svelte version 6.0.5

┌  Welcome to SvelteKit!
│
◇  Which Svelte app template?
│  SvelteKit demo app
│
◇  Add type checking with TypeScript?
│  Yes, using JavaScript with JSDoc comments
│
◇  Select additional options (use arrow keys/space bar)
│  none
│
└  Your project is ready!

✔ Type-checked JavaScript
  https://www.typescriptlang.org/tsconfig#checkJs

Install community-maintained integrations:
  https://github.com/svelte-add/svelte-add

Next steps:
  1: cd my-svelte-app
  2: npm install
  3: git init && git add -A && git commit -m "Initial commit" (optional)
  4: npm run dev -- --open

To close the dev server, hit Ctrl-C

Stuck? Visit us at https://svelte.dev/chat

Next steps の内容に合わせて、実行します。git の登録は行わないため飛ばします。

cd my-svelte-app
npm install
npm run dev -- --open

下記のような画面が開いたら完了です。

SvelteSvelte

Posted by kidatti