package.json and Config Files

package.json

{
  "name": "my-app",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview",
    "lint": "eslint ."
  },
  "dependencies": {
    "react": "^19.0.0",
    "react-dom": "^19.0.0"
  },
  "devDependencies": {
    "@vitejs/plugin-react": "^4.3.4",
    "eslint": "^9.17.0",
    "vite": "^6.0.5"
  }
}
  • scripts: commands you run with npm run <name>.
  • dependencies: needed at runtime (shipped to users).
  • devDependencies: only needed while developing/building.
  • package-lock.json: locks exact versions so every install is identical. Commit it.

vite.config.js, eslint.config.js, .gitignore

FilePurpose
vite.config.jsVite plugins (React), dev server port, proxy to your API, path aliases
eslint.config.jscode quality rules, including the Rules of Hooks
.gitignorekeeps node_modules, dist and .env files out of Git
.envenvironment variables; in Vite only names starting with VITE_ reach the browser
// vite.config.js
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [react()],
  server: { port: 3000, proxy: { '/api': 'http://localhost:5000' } },
});