Api

createSafeActionClient

API reference for createSafeActionClient — configure error handling, middleware, and create reusable type-safe action clients for Nuxt.

createSafeActionClient

Creates a new action client. Call this once and reuse it across actions.

Import

import { createSafeActionClient } from '#safe-action'

Signature

function createSafeActionClient(opts?: CreateSafeActionClientOpts): SafeActionClient

Options

Option	Type	Required	Description
`handleServerError`	`(error: Error) => string`	No	Transform server errors before sending to the client. Receives the thrown error and should return a string message.

Usage

Basic

export const actionClient = createSafeActionClient()

With Error Handling

export const actionClient = createSafeActionClient({
  handleServerError: (error) => {
    console.error('Action error:', error.message)
    return error.message
  },
})

With Error Sanitization

import { ActionError } from '#safe-action'

export const actionClient = createSafeActionClient({
  handleServerError: (error) => {
    // Only expose intentional error messages
    if (error instanceof ActionError) {
      return error.message
    }
    // Hide internal details from the client
    return 'An unexpected error occurred'
  },
})

Returns

A SafeActionClient instance with the following methods:

Method	Description
`.schema()`	Set input validation schema
`.outputSchema()`	Set output validation schema
`.use()`	Add middleware
`.metadata()`	Attach metadata
`.action()`	Define the handler (terminal)

See the Builder Chain reference for details on each method.

Edit this pageorReport an issue

Error Handling

Handle server errors with ActionError and return field-level Zod validation errors to Vue components using nuxt-safe-action.

Builder Chain

API reference for the nuxt-safe-action builder chain — schema, outputSchema, use, metadata, and action methods for composing type-safe server actions.