---
url: >-
  https://lit-ui-router.dev/reference/ui-router-server/location/variables/installServerLocation.md
---
[ui-router-server](../../index.md) / [location](../index.md) / installServerLocation

# Variable: installServerLocation

```ts
const installServerLocation: <T>(router, options?) => T;
```

Defined in: [location.ts:162](https://github.com/simshanith/lit-ui-router/blob/740888c2b2ba358c4dfa52a122e927df6a604b12/packages/ui-router-server/src/location.ts#L162)

Installs [\`serverLocationPlugin\`](../functions/serverLocationPlugin.md) on `router`,
points it at the requested url, and returns the same router.

It takes a router rather than constructing one: a server render drives
whatever `UIRouter` its client uses — `lit-ui-router`'s `UIRouterLit`
included — and constructing one here pins that choice. Build the router
yourself and hand it over; it comes back at the type it went in as.

The url is set before any transition runs, so the router's first sync
(`start()` on a `UIRouterLit`, `urlService.sync()` on a core router) heads
for the state the request asked for. Neither returns anything, and the
transition settles asynchronously, resolves included: await it before
reading the router. `transitionService.onSuccess` fires when it lands;
`stateService.go()` returns the transition promise where those do not.

## Type Parameters

| Type Parameter | Description |
| ------ | ------ |
|  `T` *extends* [`UIRouter`](https://ui-router.github.io/core/docs/latest/classes/_router_.uirouter.html) | the router type, returned unchanged |

## Parameters

| Parameter | Type | Description |
| ------ | ------ | ------ |
| `router` | `T` | a freshly constructed router, with no location plugin yet |
| `options?` | [`ServerLocationOptions`](../interfaces/ServerLocationOptions.md) | the request's url, the mount's shape, the url shape, and the url config |

## Returns

`T`

`router`, for chaining

## Throws

if `urlConfig` is given and a state with a url, or a `when()` url rule, is already registered; the router is left unchanged

## Example

```ts
import { servicesPlugin, UIRouter, type StateDeclaration } from '@uirouter/core';
import { installServerLocation } from 'ui-router-server/location';

declare const request: Request;
declare const states: StateDeclaration[];

const { pathname, search } = new URL(request.url);
const router = new UIRouter();
router.plugin(servicesPlugin);
installServerLocation(router, {
  url: pathname + search,
  urlConfig: { strict: false },
});
// core stamps each registered declaration with $$state, so register a copy per router
states.forEach((state) => router.stateRegistry.register({ ...state }));
const settled = new Promise<void>((resolve) => {
  router.transitionService.onSuccess({}, () => resolve());
});
router.urlService.sync();
await settled;
```