Use Static Files and Vercel without the .html Extension in URLs

This blog post explains how you can configure a Vercel website to allow URLs for static HTML files without requiring the .html extension in URLs.

By default, Vercel requires that URLs for static HTML files include the .html extension. An HTTP request for the URL /path/file.html will retrieve the file at that path, but an HTTP request for /path/file will not retrieve the .html file at that path. If you rename /path/file.html to /path/file and request /path/file, likely because Vercel cannot determine the MIME type for the file, the browser will try to download it rather than rendering that file.

To configure a Vercel solution to serve HTML files in response to HTTP requests for URLs without the .html extension, you can create a vercel.json file in the document root containing the following:

{  
    "cleanUrls": true
}

This works even if the solution does not depend on Next.js.

HTTP requests for /vercel.json return HTTP 404.

The Vercel documentation lists additional options to configure URL processing, HTTP headers, and redirects for static sites:

If you use Next.js, you may prefer to configure features related to routing in /next.config.js:

9.November.2021 Update: With this configuration, if both /path/index.html and /path.html exist, then requests for /path/index.html and /path/index will redirect to /path, which will serve /path.html. There appears to be no way to access /path/index.html.

One thought on “Use Static Files and Vercel without the .html Extension in URLs

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: