---
title: "Serving Static Files"
description: "The Serve Static feature allows your Hono application to host files such as images, stylesheets, or client-side scripts directly from your server's filesystem or a storage service."
last_updated: "2026-07-02T09:15:05.270927+00:00"
canonical_url: "https://www.doc0.app/docs/552ca36e-f67e-41c3-a07a-def9bd9551b0/guide/middleware/serving-static-files"
---

The Serve Static feature allows your Hono application to host files such as images, stylesheets, or client-side scripts directly from your server's filesystem or a storage service. 

Instead of building complex routing for every asset, you can point the middleware to a directory, and it will automatically handle request mapping, MIME type detection, and basic file serving.

## How to use
To serve static files, use the `serveStatic` function provided by the adapter corresponding to your runtime environment (e.g., Bun, Deno).

1. **Import the adapter**: Use the specific import for your runtime.
2. **Apply the middleware**: Add it to your Hono instance.

**Example: Serving files in Bun**
```typescript
import { Hono } from 'hono'
import { serveStatic } from 'hono/bun'

const app = new Hono()

// Serve files from the 'public' directory
app.use('/static/*', serveStatic({ root: './public' }))

export default app
```

## Configuration Options
The `serveStatic` middleware accepts an options object to customize how files are retrieved and processed.

| Option | Type | Description |
| :--- | :--- | :--- |
| `root` | `string` | The base directory to serve files from. Defaults to `./`. |
| `path` | `string` | A fixed path to serve instead of the request path. |
| `precompressed` | `boolean` | If true, looks for .br, .zst, or .gz versions of the file. |
| `mimes` | `object` | Custom mapping for file extensions to MIME types. |
| `onFound` | `function` | Callback triggered when a file is successfully found. |
| `onNotFound` | `function` | Callback triggered when a file cannot be found. |
| `rewriteRequestPath` | `function` | Function to transform the incoming request URL path. |

> [!NOTE]
> The `serveStatic` middleware is environment-specific. Always import it from `hono/bun`, `hono/deno`, or the relevant adapter to ensure it has the correct permissions to access the local file system.

## Key Concepts
* **Middleware Ordering**: `serveStatic` is a standard Hono middleware. It will only serve a file if it is found. If it is not found, it calls `next()` to allow other routes or middleware to handle the request.
* **Default Document**: If a request matches a directory, the middleware will automatically attempt to serve an `index.html` file from within that directory.
* **Pre-compression**: By setting `precompressed: true`, the server will check for files with encoding extensions (e.g., `.br` for Brotli) if the client supports them via the `Accept-Encoding` header. This can significantly reduce bandwidth usage.

## Best Practices and Warnings
> [!WARNING]
> When serving files, ensure that your `root` directory is correctly scoped. Never point the `root` to sensitive system directories.

> [!IMPORTANT]
> The Cloudflare Workers adapter for `serveStatic` is currently deprecated. For Cloudflare environments, it is recommended to use the official [Cloudflare Static Assets](https://developers.cloudflare.com/workers/static-assets/) or [Cloudflare Pages](https://pages.cloudflare.com/) deployment patterns.

## Execution Flow
```mermaid
graph TD
    A[User Request] --> B{File exists?}
    B -- Yes --> C[Determine MIME type]
    C --> D[Send file content]
    B -- No --> E[Run onNotFound callback]
    E --> F[Call next middleware]
```

## Related

- [Runtime Adapters](https://www.doc0.app/docs/552ca36e-f67e-41c3-a07a-def9bd9551b0/guide/advanced-features/runtime-adapters)


## Sitemap

See the full [sitemap](https://www.doc0.app/docs/552ca36e-f67e-41c3-a07a-def9bd9551b0/llms.txt) for all pages in this wiki.