要使用 SvelteKit 作为静态网站生成器（SSG），请使用 [`adapter-static`](https://github.com/sveltejs/kit/tree/main/packages/adapter-static)。

这将为您的整个网站预渲染成一个静态文件的集合。如果您只想预渲染一些页面，而动态服务器渲染其他页面，您需要使用不同的适配器，并配合[以下`预渲染`选项](page-options#prerender)。

## 
使用

安装 `npm i -D @sveltejs/adapter-static` 后，将适配器添加到您的`svelte.config.js`中：

```js
// @errors: 2307
/// file: svelte.config.js
import adapter from '@sveltejs/adapter-static';

export default {
	kit: {
		adapter: adapter({
			// default options are shown. On some platforms
			// these options are set automatically — see below
			pages: 'build',
			assets: 'build',
			fallback: undefined,
			precompress: false,
			strict: true
		})
	}
};
```

...并在您的根布局中添加[`prerender`](page-options#prerender)选项：

```js
/// file: src/routes/+layout.js
// This can be false if you're using a fallback (i.e. SPA mode)
export const prerender = true;
```

> \[!注意\] 您必须确保 SvelteKit 的[`trailingSlash`](page-options#trailingSlash)选项根据您的环境适当设置。如果您的托管在接收到对``/a的请求时没有渲染`/a.html`，那么您需要在根布局中设置`trailingSlash: 'always'`以创建`/a/index.html`。``

## 
零配置支持

一些平台支持零配置（未来还将有更多）：

*   [Vercel](https://vercel.com)

在这些平台上，您应该省略适配器选项，以便 `adapter-static` 提供最佳配置：

```js
// @errors: 2304
/// file: svelte.config.js
export default {
	kit: {
		adapter: adapter(---{...}---)
	}
};
```

## 
选项

### 
页

目录用于写入预渲染页面的位置。默认为 `build`。

### 
资产

目录用于写入静态资源（`static`的内容，以及由 SvelteKit 生成的客户端 JS 和 CSS）。通常，这应该与`pages`相同，并且默认为`pages`的值，但在罕见情况下，您可能需要将页面和资源输出到不同的位置。

### 
回退

指定一个用于 [SPA 模式](single-page-apps) 的回退页面，例如 `index.html` 或 `200.html` 或 `404.html`。

### 
预压缩

如果 `true`，则使用 brotli 和 gzip 预压缩文件。这将生成`.br`和`.gz`文件。

### 
严格

默认情况下，`adapter-static` 会检查您的应用的所有页面和端点（如果有）是否已预渲染，或者您已设置 `fallback` 选项。此检查存在是为了防止您不小心发布一个应用，其中某些部分不可访问，因为它们未包含在最终输出中。如果您知道这是可以的（例如，当某个页面仅条件性存在时），可以将 `strict` 设置为 `false` 以关闭此检查。

## GitHub Pages

当构建[GitHub Pages](https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages)时，如果您的仓库名称不等于`your-username.github.io`，请确保更新[`config.kit.paths.base`](configuration#paths)以匹配您的仓库名称。这是因为网站将从 `https://your-username.github.io/your-repo-name` 而不是从根目录提供服务。

您还希望生成一个后备的 `404.html` 页面，以替换 GitHub Pages 显示的默认 404 页面。

一个 GitHub Pages 的配置可能看起来如下：

```js
// @errors: 2307 2322
/// file: svelte.config.js
import adapter from '@sveltejs/adapter-static';

/** @type {import('@sveltejs/kit').Config} */
const config = {
	kit: {
		adapter: adapter({
			fallback: '404.html'
		}),
		paths: {
			base: process.argv.includes('dev') ? '' : process.env.BASE_PATH
		}
	}
};

export default config;
```

您可以使用 GitHub Actions 在您进行更改时自动将您的站点部署到 GitHub Pages。以下是一个示例工作流程：

```yaml
### file: .github/workflows/deploy.yml
name: Deploy to GitHub Pages

on:
  push:
    branches: 'main'

jobs:
  build_site:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4

      # If you're using pnpm, add this step then change the commands and cache key below to use `pnpm`
      # - name: Install pnpm
      #   uses: pnpm/action-setup@v3
      #   with:
      #     version: 8

      - name: Install Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: npm

      - name: Install dependencies
        run: npm install

      - name: build
        env:
          BASE_PATH: '/${{ github.event.repository.name }}'
        run: |
          npm run build

      - name: Upload Artifacts
        uses: actions/upload-pages-artifact@v3
        with:
          # this should match the `pages` option in your adapter-static options
          path: 'build/'

  deploy:
    needs: build_site
    runs-on: ubuntu-latest

    permissions:
      pages: write
      id-token: write

    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}

    steps:
      - name: Deploy
        id: deployment
        uses: actions/deploy-pages@v4
```

如果您没有使用 GitHub actions 来部署您的网站（例如，您正在将构建的网站推送到其自己的仓库），请在您的`static`目录中添加一个空的`.nojekyll`文件，以防止 Jekyll 干扰。