Skip to content

TypeScript error for Per-Route CSRF Configuration #651

@kouts

Description

@kouts

Environment

------------------------------
- Operating System: Darwin
- Node Version:     v23.10.0
- Nuxt Version:     4.0.3
- CLI Version:      3.28.0
- Nitro Version:    2.12.4
- Package Manager:  [email protected]

Nuxt Security Version

v2.4.0

Default setup used?

Yes, the bug happens even if the security option is not customized

Security options

Reproduction

https://stackblitz.com/edit/github-gzbuzr-iqidxa1w

Description

When attempting to configure per-route CSRF protection using routeRules in nuxt.config.ts, TypeScript throws an error stating that the csurf property does not exist in the route rules type definition.

Expected Behavior
According to the nuxt-csurf documentation (which nuxt-security uses under the hood), per-route CSRF configuration should be supported:

// This should work without TypeScript errors
export default defineNuxtConfig({
  routeRules: {
    '/api/nocsrf': {
      csurf: false
    },
    '/api/test': {
      csurf: {
        methodsToProtect: ['POST']
      }
    }
  }
})

Actual Behavior
TypeScript throws an error:

Object literal may only specify known properties, and 'csurf' does not exist in type '{ cache?: false | { swr?: boolean | ... }'
Image

Code to Reproduce

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-security'],
  security: {
    csrf: true,
  },
  routeRules: {
    '/api/logout': { csurf: false }, // ❌ TypeScript error here
  }
})

Additional context

No response

Logs

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions