Reactアプリを構築する
ViteとDenoを使ってReactアプリを作成する
プロジェクト作成
$ deno run -A npm:create-vite@latest
✔ Project name: … dq2lib ? Select a framework: › - Use arrow-keys. Return to submit. Vanilla Vue ❯ React Preact Lit Svelte Solid Qwik Others
✔ Project name: … dq2lib ✔ Select a framework: › React ? Select a variant: › - Use arrow-keys. Return to submit. TypeScript ❯ TypeScript + SWC JavaScript JavaScript + SWC Remix ↗
✔ Project name: … dq2lib ✔ Select a framework: › React ✔ Select a variant: › TypeScript + SWC Scaffolding project in /home/tomoyan/my_projects/dq2lib... Done. Now run: cd dq2lib npm install npm run dev
依存パッケージをインストール
$ cd dq2lib $ pnpm install
Packages: +144 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ Downloading @swc/core-linux-x64-musl@1.7.26: 21.01 MB/21.01 MB, done Downloading @swc/core-linux-x64-gnu@1.7.26: 17.31 MB/17.31 MB, done Progress: resolved 189, reused 113, downloaded 31, added 144, done node_modules/.pnpm/@swc+core@1.7.26/node_modules/@swc/core: Running postinstall script, done in 1.2s node_modules/.pnpm/esbuild@0.21.5/node_modules/esbuild: Running postinstall script, done in 648ms dependencies: + react 18.3.1 + react-dom 18.3.1 devDependencies: + @eslint/js 9.12.0 + @types/react 18.3.11 + @types/react-dom 18.3.0 + @vitejs/plugin-react-swc 3.7.1 + eslint 9.12.0 + eslint-plugin-react-hooks 5.1.0-rc-fb9a90fa48-20240614 + eslint-plugin-react-refresh 0.4.12 + globals 15.10.0 + typescript 5.6.2 + typescript-eslint 8.8.0 + vite 5.4.8 Done in 1m 34.6s
プロジェクト実行
$ pnpm dev
VITE v5.4.8 ready in 1662 ms ➜ Local: http://localhost:5173/ ➜ Network: use --host to expose ➜ press h + enter to show help
動作確認🤔
http://localhost:5173/