Closed5

Bunを使ってのNext.js+shadcn/ui環境構築備忘録

hanetsukihanetsuki

前述

筆者は、Homebrewを使ってBunをインストールしている。

Bunのバージョンは1.0.11

hanetsukihanetsuki

Initialize Next.js

bun create next-app
✔ What is your project named? … bun-next-shadcn
✔ Would you like to use TypeScript? … No / Yes
✔ Would you like to use ESLint? … No / Yes
✔ Would you like to use Tailwind CSS? … No / Yes
✔ Would you like to use `src/` directory? … No / Yes
✔ Would you like to use App Router? (recommended) … No / Yes
✔ Would you like to customize the default import alias? … No / Yes
✔ What import alias would you like configured? … @/*

https://github.com/tsuki-lab/bun-next-shadcn/commit/26452150648df4e13a2cf4c4dd9a5e93b7b9b556

Initialize shadcn UI

bunx shadcn-ui init
✔ Would you like to use TypeScript (recommended)? … no / yes
✔ Which style would you like to use? › Default
✔ Which color would you like to use as base color? › Stone
✔ Where is your global CSS file? … app/globals.css
✔ Would you like to use CSS variables for colors? … no / yes
✔ Where is your tailwind.config.js located? … tailwind.config.js
✔ Configure the import alias for components: … @/components
✔ Configure the import alias for utils: … @/lib/utils
✔ Are you using React Server Components? … no / yes
✔ Write configuration to components.json. Proceed? … yes

https://github.com/tsuki-lab/bun-next-shadcn/commit/2e7f90b6abfa3e335d424e0198020f556cfb5521

hanetsukihanetsuki

Created bun.lockb

rm -rf package-lock.json node_modules
bun install

https://vercel.com/changelog/bun-install-is-now-supported-with-zero-configuration

Run local server

bun --bun run dev

bun --bun run dev
$ next dev
   ▲ Next.js 14.0.2
   - Local:        http://localhost:3000

 ✓ Ready in NaNms
 ○ Compiling / ...
 ✓ Compiled / in 3.9s (496 modules)
 ✓ Compiled in 2.9s (237 modules)
 ○ Compiling /not-found ...
 ✓ Compiled /not-found in 1131ms (487 modules)

bun run dev

bun run dev
$ next dev
   ▲ Next.js 14.0.2
   - Local:        http://localhost:3000

 ✓ Ready in 2.7s
 ○ Compiling / ...
 ✓ Compiled / in 2.1s (496 modules)
 ✓ Compiled in 504ms (237 modules)
 ✓ Compiled /favicon.ico in 386ms (510 modules)
 ✓ Compiled /not-found in 193ms (515 modules)
このスクラップは6ヶ月前にクローズされました