Skip to content
Cloudflare Docs

Changelog

New updates and improvements at Cloudflare.

Subscribe to RSS
View all RSS feeds

hero image

Enhanced support for static assets with the Cloudflare Vite plugin

You can now use any of Vite's static asset handling features in your Worker as well as in your frontend. These include importing assets as URLs, importing as strings and importing from the public directory as well as inlining assets.

Additionally, assets imported as URLs in your Worker are now automatically moved to the client build output.

Here is an example that fetches an imported asset using the assets binding and modifies the response.

// Import the asset URL
// This returns the resolved path in development and production
import myImage from "./my-image.png";
export default {
async fetch(request, env) {
// Fetch the asset using the binding
const response = await env.ASSETS.fetch(new URL(myImage, request.url));
// Create a new `Response` object that can be modified
const modifiedResponse = new Response(response.body, response);
// Add an additional header
modifiedResponse.headers.append("my-header", "imported-asset");
// Return the modfied response
return modifiedResponse;
},
};

Refer to Static Assets in the Cloudflare Vite plugin docs for more info.