【Vite】フロントエンドの開発でViteを使ってみたい

$ node -v
v22.13.1
$ npm create vite@latest
$ npm install
$ npm run dev

vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vite.dev/config/
export default defineConfig({
  plugins: [react()],
})

$ npm install sass -D

about.html

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>About - My Vite Project</title>
</head>
<body>
  <h1>About Page</h1>
  <p>This is the about page of my Vite project.</p>
  <a href="index.html">Back to Home</a>

  <script type="module" src="./src/about.js"></script>
</body>
</html>

src/about.js

console.log('About page loaded!')

なるほど、使いやすそうではある。