Viteを使ってみる

環境

フォルダを作成、公式のGetting startedから
npm create vite@latestを実行。
追加のパッケージをインストールするか聞かれるため、OKする。

パッケージ名は今回は適当にsampleとする。
フレームワークはReact
そのほか？は Typescript + SWCを選択する。

Typescript: Javascriptに型を付けてデバッグしやすくしたもの。
SWC: トランスパイルがbabelよりも20倍速いらしい。よくしらん。

なんかエラー。
node_modules以下のファイルにアクセスしようとして落ちてるっぽいので、
npm initして、適当にセッティングして、もう一度実行。　通った。

ファイル群（プロジェクト）が作成された模様。以下のコマンドを実行してくれというコトらしい。（最初のフォルダ作成要らなかった）

cd vite-project
npm install
npm run dev

package.jsonに基づいて、パッケージをインストール中...
少し待つと、viteコマンドが実行されて、開いてねというコトらしい。
↓のように表示された。

➜  Local:   http://localhost:5173/
➜  Network: use --host to expose
➜  press h + enter to show help

http://localhost:5173/をブラウザで開くと、サンプルのサイトが表示された。
--hostオプションを付けて実行すると公開(ネットワーク内の他のコンピュータからアクセス可能になる）ようである。
試しに、オプションを付けないで実行すると、同ネットワーク内にあるスマホからアクセスできなかったが、オプションを付けて実行すると、、、、表示されたNetworkの一つからスマホでサーバーにアクセスできた。他の知らないIPも表示されていたが、サーバー立てたPCからしか入れないから多分大丈夫だよね？汗（変なところに公開されていませんように。俺、このテスト終わったら結婚するんだ。（しないけど））

hを押してEnterすると、ヘルプが表示された。

Shortcuts
  press r + enter to restart the server
  press u + enter to show server url
  press o + enter to open in browser
  press c + enter to clear console
  press q + enter to quit

多くはないがUIが用意されているようで助かる。

つかいやすそうでした。