TypeScript

Last updated Apr 21, 2026 Pages Functions supports TypeScript. Author any files in your /functions directory with a .ts extension instead of a .js extension to start using TypeScript.

You can add runtime types and Env types by running:

npmyarnpnpm

npx wrangler types --path='./functions/types.d.ts'

yarn wrangler types --path='./functions/types.d.ts'

pnpm wrangler types --path='./functions/types.d.ts'

Then configure the types by creating a functions/tsconfig.json file:

{
    "compilerOptions": {
        "target": "esnext",
        "module": "esnext",
        "lib": ["esnext"],
        "types": ["./types.d.ts"]
    }
}

See the wrangler types command docs for more details.

If you already have a tsconfig.json at the root of your project, you may wish to explicitly exclude the /functions directory to avoid conflicts. To exclude the /functions directory:

{
    "include": ["src/**/*"],
    "exclude": ["functions/**/*"],
    "compilerOptions": {}
}

Pages Functions can be typed using the PagesFunction type. This type accepts an Env parameter. The Env type should have been generated by wrangler types and can be found at the top of types.d.ts.

Alternatively, you can define the Env type manually. For example:

interface Env {
    KV: KVNamespace;
}

export const onRequest: PagesFunction<Env> = async (context) => {
    const value = await context.env.KV.get("example");
    return new Response(value);
};

If you are using nodejs_compat, make sure you have installed @types/node and updated your tsconfig.json.

{
    "compilerOptions": {
        "target": "esnext",
        "module": "esnext",
        "lib": ["esnext"],
        "types": ["./types.d.ts", "node"]
    }
}

Note

If you were previously using @cloudflare/workers-types instead of the runtime types generated by wrangler types, you can refer to this migration guide.

Was this helpful?

YesNo

On this page

TypeScript - 图1Docs

{"@context":"https://schema.org","@type":"TechArticle","@id":"https://developers.cloudflare.com/pages/functions/typescript/#page","headline":"TypeScript","description":"Author Pages Functions in TypeScript and configure type generation with Wrangler.","url":"https://developers.cloudflare.com/pages/functions/typescript/","inLanguage":"en","image":"https://developers.cloudflare.com/pages/functions/typescript/og.png?v=46eef2f745982dd6","dateModified":"2026-04-21","publisher":{"@type":"Organization","name":"Cloudflare","description":"One platform for your apps, agents, and workforce. Build, secure, and scale without managing infrastructure","url":"https://www.cloudflare.com/","sameAs":["https://github.com/cloudflare","https://www.linkedin.com/company/cloudflare","https://x.com/cloudflare"],"logo":{"@type":"ImageObject","url":"https://developers.cloudflare.com/logo.svg"},"address":{"@type":"PostalAddress","streetAddress":"101 Townsend St","addressLocality":"San Francisco","addressRegion":"CA","postalCode":"94107","addressCountry":"US"},"contactPoint":[{"@type":"ContactPoint","contactType":"Customer Support","url":"https://support.cloudflare.com/","availableLanguage":["English"]},{"@type":"ContactPoint","contactType":"Sales","url":"https://www.cloudflare.com/contact/","availableLanguage":["English"]}]},"isPartOf":{"@type":"WebSite","@id":"https://developers.cloudflare.com/#website","name":"Cloudflare Docs","url":"https://developers.cloudflare.com/"}}

description: Configure Pages Functions settings using a Wrangler configuration file or the Cloudflare dashboard. title: Configuration image: https://developers.cloudflare.com/pages/functions/wrangler-configuration/og.png?v=e0a97a11d71221a2

Skip to content

Documentation Index
Fetch the complete documentation index at: https://developers.cloudflare.com/pages/llms.txt
Use this file to discover all available pages before exploring further.