refactor: migrate from CRA to Vite by updating environment variables …#960
refactor: migrate from CRA to Vite by updating environment variables …#960umeshmore45 merged 2 commits intodevfrom
Conversation
…and configuration files, enhancing build process and performance. Remove deprecated files and adjust API references to align with new structure. Co-authored-by: Cursor <cursoragent@cursor.com>
There was a problem hiding this comment.
Pull request overview
Refactors the UI build toolchain by migrating from Create React App (CRA) to Vite, updating environment variable access patterns and build/runtime configuration to align with Vite’s conventions.
Changes:
- Replaced CRA
process.env.REACT_APP_*usage with Viteimport.meta.env.VITE_*and added Vite config/TS setup. - Updated UI build + containerization (Vite build output,
vite preview, HTML entrypoint changes). - Adjusted supporting scripts/config (docker-compose env vars, env generation script, upload-api build script).
Reviewed changes
Copilot reviewed 16 out of 20 changed files in this pull request and generated 8 comments.
Show a summary per file
| File | Description |
|---|---|
| upload-api/src/config/index.ts | Updates backend defaults/config values (currently replaced with placeholders). |
| upload-api/package.json | Makes build script skip non-package migration folders. |
| upload-api/migration-aem/package-lock.json | Lockfile updates (adds node/undici types). |
| api/package-lock.json | Lockfile metadata changes (dev → devOptional, removals). |
| ui/vite.config.ts | Adds Vite configuration (React SWC + tsconfig paths + logging tweaks). |
| ui/tsconfig.json | Adjusts TS target/module and adds Vite client types. |
| ui/src/vite-env.d.ts | Adds Vite client type reference. |
| ui/src/utilities/constants.ts | Migrates env var reads to import.meta.env. |
| ui/src/reportWebVitals.js | Removes CRA web-vitals helper. |
| ui/src/index.tsx | Removes web-vitals wiring from app bootstrap. |
| ui/src/components/TestMigration/index.tsx | Updates API base URL source to Vite env. |
| ui/src/components/MigrationExecution/index.tsx | Updates API base URL source to Vite env. |
| ui/src/components/ContentMapper/index.tsx | Replaces NodeJS timeout type with browser-safe ReturnType<typeof setTimeout>. |
| ui/package.json | Replaces CRA scripts/deps with Vite tooling and updates ESLint config. |
| ui/index.html | Converts CRA placeholders to Vite-style HTML + adds module entry script. |
| ui/Dockerfile | Builds UI during image build and serves via vite preview. |
| ui/.env.local | Renames env vars to VITE_*. |
| index.js | Updates generated UI env file content to VITE_*. |
| docker-compose.yml | Renames UI env vars to VITE_*. |
Files not reviewed (2)
- api/package-lock.json: Language not supported
- upload-api/migration-aem/package-lock.json: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
…s; adjust .gitignore and package.json to include new dependencies and ensure proper environment variable handling
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 17 out of 21 changed files in this pull request and generated 2 comments.
Files not reviewed (2)
- api/package-lock.json: Language not supported
- upload-api/migration-aem/package-lock.json: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| VITE_WEBSITE_BASE_URL="http://localhost:3000/" | ||
| VITE_BASE_API_URL="http://localhost:5001/" | ||
| VITE_API_VERSION=v2 | ||
| VITE_HOST="http://localhost:3000" | ||
| VITE_UPLOAD_SERVER="http://localhost:4002/" | ||
| VITE_OFFLINE_CMS=true |
There was a problem hiding this comment.
ui/.env.local is committed with localhost defaults, but Vite loads .env.local even in production builds. This risks baking machine-specific URLs into the bundle and can also conflict with docker-provided env at build time. Remove this file from version control (keep it developer-local), and instead commit a .env.example (or .env) with safe placeholder values.
| VITE_WEBSITE_BASE_URL="http://localhost:3000/" | |
| VITE_BASE_API_URL="http://localhost:5001/" | |
| VITE_API_VERSION=v2 | |
| VITE_HOST="http://localhost:3000" | |
| VITE_UPLOAD_SERVER="http://localhost:4002/" | |
| VITE_OFFLINE_CMS=true | |
| VITE_WEBSITE_BASE_URL="https://frontend.example.com/" | |
| VITE_BASE_API_URL="https://api.example.com/" | |
| VITE_API_VERSION=v2 | |
| VITE_HOST="https://frontend.example.com" | |
| VITE_UPLOAD_SERVER="https://upload.example.com/" | |
| VITE_OFFLINE_CMS=false |
| "typeRoots": ["./node_modules/@types", "./src/types"], | ||
| "types": ["vite/client"] |
There was a problem hiding this comment.
vite/client typings are being included twice (via types: ["vite/client"] here and via src/vite-env.d.ts). Pick one mechanism to avoid redundant/global type pollution; the common Vite approach is to keep only src/vite-env.d.ts and remove the explicit types entry (or vice versa).
| "typeRoots": ["./node_modules/@types", "./src/types"], | |
| "types": ["vite/client"] | |
| "typeRoots": ["./node_modules/@types", "./src/types"] |
2 participants
…and configuration files, enhancing build process and performance. Remove deprecated files and adjust API references to align with new structure.