---
title: Static Site
contributors:
  - the-r3aper7
  - aendel
updated_at: '2023-10-11T15:09:55Z'
created_at: '2023-10-11T15:09:55Z'
---

import PackageManagerTabs from '~/components/package-manager-tabs/index.tsx';

# Static Site Adapter

Qwik's Static Site adapter helps to generate static html files which can be easily deployed to any cloud providers.

## Installation

To integrate the `static-site` adapter, use the `add` command:


<PackageManagerTabs>
<span q:slot="pnpm">
```shell
pnpm run qwik add static
```
</span>
<span q:slot="npm">
```shell
npm run qwik add static
```
</span>
<span q:slot="yarn">
```shell
yarn run qwik add static
```
</span>
<span q:slot="bun">
```shell
bun run qwik add static
```
</span>
</PackageManagerTabs>

Above command will create a directory at project root named `adapters/static/vite.config.ts` with the below code.

```ts title="adapters/static/vite.config.ts"
import { staticAdapter } from "@builder.io/qwik-city/adapters/static/vite";
import { extendConfig } from '@builder.io/qwik-city/vite';
import baseConfig from '../../vite.config';

export default extendConfig(baseConfig, () => {
  return {
    build: {
      ssr: true,
      rollupOptions: {
        input: ['@qwik-city-plan'],
      },
    },
    plugins: [
      staticAdapter({
        origin: 'https://yoursite.qwik.dev',
      }),
    ],
  };
});
```

> Remember to change the `origin` in this file to your domain.

Now, you can generate static site while using `Qwik`'s rich ecosystem, file based routing and many more.
