microsoft / microsoft/aspire

Feature request: WithFrontendConfig API for passing Aspire parameters to SPA frontends

Open
#14,471 1 comment 1 reaction 0 assignees View on GitHub
area-app-model
Dominant language
C#
Stars
6.3k
Forks
991
Avg merge
2d 15h
Merged PRs (30d)
196

Description

### Is your feature request related to a problem?

Aspire parameters (from `AddParameter`) are set at runtime, but Vite/React/Angular bake environment variables at build time. There is no built-in way to pass an Aspire parameter to a SPA frontend.

The current workaround requires:
1. Passing the parameter to the API as an env var (`WithEnvironment`)
2. Writing a custom `/api/config/{key}` endpoint in the API project
3. Having the SPA fetch from that endpoint at mount time

Every team using `AddViteApp` / `AddNpmApp` with parameters will need this pattern. We filed a docs recipe request at microsoft/aspire.dev#394 but believe this should also be a first-class product feature.

### Describe the solution you'd like

A `WithFrontendConfig` API (or similar) that bridges Aspire parameters to SPA frontends:

```csharp
builder.AddViteApp("frontend", "./src/frontend")
.WithFrontendConfig("GOOGLE_CLIENT_ID", googleClientId);
```

This could auto-generate a config endpoint (or inject a `__config.json` at a well-known path like `/__aspire/config`) that the SPA can fetch at runtime.

### Describe alternatives you've considered

- **Manual config endpoint** — works but requires boilerplate in every project (our implementation is ~18 lines in `ConfigEndpoints.cs`)
- **Vite plugin that fetches config at build time** — defeats the purpose of runtime params
- **Documenting the pattern** — filed as microsoft/aspire.dev#394, zero engagement so far

### Additional context

We're using Aspire 13.2.0-preview.1 with `AddViteApp` + `WithPnpm()` and a React 19 frontend. The workaround (config endpoint pattern) has been stable across two sprints and works well — but it's boilerplate that every SPA+Aspire project will reinvent.

Contributor guide

Open the contributing guide

Research direction

Start by tracing the AddViteApp and AddNpmApp entry points and their existing WithEnvironment behavior. Compare the proposed runtime endpoint or __config.json contract against the Vite/React and Angular use cases; done means supported SPA frontends can consume AddParameter values without each project creating a custom endpoint.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, csharp, react, vite
Domain
backend-api-design, frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.