chore(frontend): CRA → Vite 移行 / フロント依存刷新 by YasunoriMATSUOKA · Pull Request #43 · nemtus/hackathon

YasunoriMATSUOKA · 2026-06-08T14:10:00Z

概要

メンテナンス再生作業の PR3/4。非推奨の react-scripts(CRA)を Vite へ移行。CRA 由来でほぼ全ての root 脆弱性を解消します。

⚠️ PR2(chore/functions-deps-node22)にスタック。PR1→PR2 マージ後にベースが main へ切り替わります。

ビルドツール

react-scripts を Vite 8 + @vitejs/plugin-react に置換(vite.config.ts 追加)
outDir: build/ 固定で firebase.json(hosting public: "build")と CD ワークフローは無変更。baseUrl: src の絶対 import(models/ components/ utils/ images/)は Vite ネイティブの resolve.tsconfigPaths で解決
public/index.html → ./index.html(%PUBLIC_URL% 除去、module script 追加)
envPrefix: 'REACT_APP_' で既存の環境変数名・シークレット・.env.testnet/.env.mainnet をそのまま流用。アクセスのみ process.env.REACT_APP_* → import.meta.env.REACT_APP_*(19箇所)、エミュレータ判定を import.meta.env.DEV へ
"type": "module" 化に伴い postcss/tailwind config を .cjs にリネーム
tsconfig 調整(target ES2020 / moduleResolution bundler / vite/client types)+ tsconfig.node.json 追加 / react-app-env.d.ts → vite-env.d.ts

依存更新

firebase ^9 → ^12、react-firebase-hooks 5.1.1、react-icons ^5、yup ^1.7、react-hook-form ^7.78、fontawesome ^6.7、TypeScript ^5.9、ESLint 8.57 + @typescript-eslint 8、tailwind ^3.4(3系維持)、daisyui ^2.52(2系維持)、firebase-tools ^15
dotenv-cli / web-vitals(no-op)/ 旧 CRA ボイラープレートテストを除去

型修正(TS 5.9 + resolvers 3 で顕在化)

各 create フォームで yupResolver を Resolver<T> にキャスト(スキーマはサーバ計算項目を意図的に除外)
数値和に対する到達不能な ?? 0 を除去

脆弱性

root: 38 → 3(全て moderate かつ dev専用の firebase-tools CLI 由来: gaxios/uuid、最新版でも残存)。high/critical: 0 ✅

検証

tsc --noEmit 0 エラー / eslint クリーン / vite build(build/ 生成)成功 / vite preview でアプリ配信を確認

🤖 Generated with Claude Code

react-scripts (CRA) is deprecated and was the source of nearly all root vulnerabilities, none of which npm audit fix could resolve. Migrate to Vite. Build tooling: - Replace react-scripts with Vite 8 + @vitejs/plugin-react; add vite.config.ts. - outDir set to build/ so firebase.json (hosting public: "build") and the CD workflows need no change. Native resolve.tsconfigPaths handles the existing baseUrl=src absolute imports (models/, components/, utils/, images/). - Move public/index.html to ./index.html, drop %PUBLIC_URL%, add module script. - envPrefix 'REACT_APP_' keeps the existing env-var names, secrets and .env.testnet/.env.mainnet working unchanged; access migrated from process.env.REACT_APP_* to import.meta.env.REACT_APP_* (19 sites), and the emulator gate from process.env.NODE_ENV to import.meta.env.DEV. - "type": "module"; rename postcss/tailwind configs to .cjs. - tsconfig: target ES2020, moduleResolution bundler, vite/client types; add tsconfig.node.json; replace react-app-env.d.ts with vite-env.d.ts. - Scripts: vite / vite build (with tsc --noEmit typecheck) / --mode testnet|mainnet. Dependency updates: - firebase ^9 -> ^12, react-firebase-hooks ^5.1.1, react-icons ^5, yup ^1.7, react-hook-form ^7.78, fontawesome ^6.7, typescript ^5.9, eslint 8.57 + @typescript-eslint 8, tailwind ^3.4 (3.x kept), daisyui ^2.52 (2.x kept), firebase-tools ^15. - Remove dotnet-cli/dotenv-cli (Vite handles env), web-vitals + reportWebVitals (no-op boilerplate), and the stale CRA App.test boilerplate. Type fixes surfaced by TS 5.9 + @hookform/resolvers 3: cast yupResolver output to Resolver<T> in the create forms (schemas intentionally omit server-computed fields), and drop an unreachable `?? 0` on a numeric sum. Result: root npm audit 38 -> 3, all moderate and dev-only (firebase-tools CLI: gaxios/uuid, latest available). high/critical: 0. tsc, eslint and vite build all pass; preview serves the app. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

coderabbitai · 2026-06-08T14:10:07Z

Important

Review skipped

Auto reviews are disabled on base/target branches other than the default branch.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 38526ef8-ff78-41e8-98cf-820316e19c6a

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch chore/frontend-vite-migration

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Copilot

Pull request overview

This PR (PR3/4 in the maintenance series) migrates the frontend build system from CRA (react-scripts) to Vite, refreshes key frontend dependencies, and updates environment-variable access to Vite’s import.meta.env while keeping the existing REACT_APP_ naming and build/ output for Firebase Hosting compatibility.

Changes:

Replace CRA with Vite (new vite.config.ts, root index.html, updated TS configs, and ESM conversion via "type": "module").
Update runtime env access from process.env.REACT_APP_* / process.env.NODE_ENV to import.meta.env.REACT_APP_* / import.meta.env.DEV, and add Vite env typings.
Refresh dependencies (Firebase v12, TypeScript 5.9, ESLint/tooling updates) and remove CRA boilerplate (web-vitals + CRA test scaffolding).

Reviewed changes

Copilot reviewed 30 out of 36 changed files in this pull request and generated 1 comment.

Show a summary per file

File	Description
vite.config.ts	Introduces Vite configuration (React plugin, env prefix, build outDir/target, dev server port).
tsconfig.node.json	Adds TS config for Node-side tooling (Vite config typechecking).
tsconfig.json	Updates TS target/moduleResolution and adds Vite client typings + project reference.
tailwind.config.cjs	Adds Tailwind config in CJS format to remain compatible with ESM root package.
postcss.config.cjs	Adds PostCSS config in CJS format for Tailwind/autoprefixer.
index.html	Adds Vite entry HTML at repo root (replaces CRA public template).
public/index.html	Removes CRA HTML template from `public/`.
package.json	Switches scripts from CRA to Vite, adds `"type": "module"`, updates dependencies/devDependencies.
src/vite-env.d.ts	Adds `import.meta.env.REACT_APP_*` type declarations for Vite.
src/react-app-env.d.ts	Removes CRA `react-scripts` type reference.
src/utils/firebase/index.ts	Migrates Firebase config/env access to `import.meta.env` and emulator gating to `import.meta.env.DEV`.
src/index.tsx	Removes CRA web-vitals wiring (and associated import).
src/reportWebVitals.ts	Removes CRA web-vitals helper module.
src/setupTests.ts	Removes CRA Jest setup for `@testing-library/jest-dom`.
src/App.test.tsx	Removes CRA starter test.
src/models/public/years/results/index.ts	Removes unreachable `?? 0` from total-points calculation.
src/components/widgets/table/PrivateUserTxsTable.tsx	Updates block explorer link base to `import.meta.env.REACT_APP_SYMBOL_BLOCK_EXPLORER_URL`.
src/components/widgets/form/PrivateUserVoteCreateForm.tsx	Updates CURRENT_YEAR env access and adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/form/PrivateUserTeamCreateForm.tsx	Updates SYMBOL_PREFIX env access and adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/form/PrivateUserSubmissionCreateForm.tsx	Adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/form/PrivateUserJudgeCreateForm.tsx	Updates CURRENT_YEAR env access and adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/form/PrivateUserFinalVoteCreateForm.tsx	Updates CURRENT_YEAR env access and adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/form/PrivateUserFinalJudgeCreateForm.tsx	Updates CURRENT_YEAR env access and adds `Resolver<T>` cast for `yupResolver`.
src/components/widgets/card/ServiceOverviewCard.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/widgets/card/PublicTeamCard.tsx	Updates block explorer link base to `import.meta.env`.
src/components/widgets/card/PrivateUserTeamCard.tsx	Updates block explorer link base to `import.meta.env`.
src/components/widgets/card/PrivateUserCard.tsx	Updates block explorer link base to `import.meta.env`.
src/components/pages/users/[userId]/index.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/home/index.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/votes/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/teams/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/submissions/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/judges/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/final-votes/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.
src/components/pages/users/[userId]/years/[yearId]/final-judges/create.tsx	Updates CURRENT_YEAR env access to `import.meta.env`.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

+  // Resolve the tsconfig `baseUrl: "src"` absolute imports (e.g. 'models/...',
+  // 'components/...') natively (Vite 8+).
+  resolve: {
+    tsconfigPaths: true,
+  },


Copilot AI review requested due to automatic review settings June 8, 2026 14:10

Copilot started reviewing on behalf of YasunoriMATSUOKA June 8, 2026 14:10 View session

YasunoriMATSUOKA mentioned this pull request Jun 8, 2026

ci: ツールチェーンを Node 24 へ統一 / audit ゲート厳格化 #44

Merged

Copilot AI reviewed Jun 8, 2026

View reviewed changes

Comment thread vite.config.ts

Comment on lines +7 to +11

// Resolve the tsconfig `baseUrl: "src"` absolute imports (e.g. 'models/...',

// 'components/...') natively (Vite 8+).

resolve: {

tsconfigPaths: true,

},

Base automatically changed from chore/functions-deps-node22 to main June 8, 2026 14:24

YasunoriMATSUOKA merged commit 542bf60 into main Jun 8, 2026
2 of 3 checks passed

YasunoriMATSUOKA deleted the chore/frontend-vite-migration branch June 8, 2026 14:25

Navigation Menu

Uh oh!

Uh oh!

chore(frontend): CRA → Vite 移行 / フロント依存刷新 - #43

chore(frontend): CRA → Vite 移行 / フロント依存刷新#43
YasunoriMATSUOKA merged 1 commit into
mainfrom
chore/frontend-vite-migration

YasunoriMATSUOKA commented Jun 8, 2026

Uh oh!

coderabbitai Bot commented Jun 8, 2026

Review skipped

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Uh oh!

Conversation

YasunoriMATSUOKA commented Jun 8, 2026

概要

ビルドツール

依存更新

型修正(TS 5.9 + resolvers 3 で顕在化)

脆弱性

検証

Uh oh!

coderabbitai Bot commented Jun 8, 2026

Review skipped

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants