> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/CKoldo/Vacaciones-front/llms.txt
> Use this file to discover all available pages before exploring further.

# Environment Variables

> Configure environment variables for local development and production deployments of the Módulo de Registro de Vacaciones.

The app uses Vite's built-in environment variable system. Variables are read at build time and embedded in the client bundle.

<Warning>
  All environment variables exposed to the browser must be prefixed with `VITE_`. Variables without this prefix are stripped from the build output and will be `undefined` at runtime.
</Warning>

## Available variables

| Variable       | Required      | Default                 | Description                                                                      |
| -------------- | ------------- | ----------------------- | -------------------------------------------------------------------------------- |
| `VITE_API_URL` | In production | `http://localhost:5175` | Base URL of the backend API server. Trailing slashes are stripped automatically. |

## VITE\_API\_URL

`VITE_API_URL` sets the base URL that the frontend uses when making API requests. It is read in `src/app/api.ts`:

```typescript theme={null}
const API_BASE = (import.meta.env.VITE_API_URL || 'http://localhost:5175').replace(/\/$/, '');
```

If the variable is not set, the app falls back to `http://localhost:5175`.

## Local development

During local development you do **not** need to set `VITE_API_URL`. Vite's dev server proxies all requests that start with `/api` to `http://localhost:5175`, so the frontend and backend communicate through the proxy without cross-origin issues.

This proxy is configured in `vite.config.ts`:

```typescript theme={null}
server: {
  port: 5173,
  proxy: {
    '/api': {
      target: 'http://localhost:5175',
      changeOrigin: true,
      secure: false,
    },
  },
},
```

<Info>
  The Vite dev server runs on port **5173** and the backend is expected on port **5175**.
</Info>

## Production

In production there is no Vite dev server, so the proxy is not available. You must set `VITE_API_URL` to the public URL of your deployed backend before building.

```bash theme={null}
VITE_API_URL=https://api.yourapp.com npm run build
```

Or set it as a persistent environment variable on your hosting platform before triggering a build.

## Setting variables in a .env file

Create a `.env` file in the project root for local overrides. Vite loads this file automatically.

```text theme={null}
# .env
VITE_API_URL=http://localhost:5175
```

For environment-specific overrides, use Vite's layered env files:

| File               | When it is loaded                     |
| ------------------ | ------------------------------------- |
| `.env`             | Always                                |
| `.env.local`       | Always, ignored by git                |
| `.env.production`  | Only when running `vite build`        |
| `.env.development` | Only when running `vite` (dev server) |

<Tip>
  Add `.env.local` to your `.gitignore` to avoid committing secrets to version control.
</Tip>