Utils Overview

Nuxt provides a comprehensive set of utility functions for navigation, data management, and component handling.

Nuxt provides utilities and auto-imported helper functions to help you build your application. These utilities are available throughout your app without needing to import them.

Navigation Utils

• navigateTo - Programmatically navigate users to pages
• abortNavigation - Prevent navigation and throw errors in route middleware

Data Management Utils

• refreshNuxtData - Refresh all or specific asyncData instances
• reloadNuxtApp - Perform a hard reload of the app

Component Preloading Utils

• prefetchComponents - Prefetch globally registered components
• preloadComponents - Preload globally registered components
• preloadRouteComponents - Preload components for a given route

Layout Utils

• setPageLayout - Dynamically change the layout of a page

HTTP Utils

• $fetch - Make HTTP requests with automatic SSR optimization

Usage

All utilities are auto-imported and available globally in your Nuxt application:

<script setup>
// Navigate to a page
await navigateTo('/dashboard')

// Refresh data
await refreshNuxtData('myKey')

// Preload a route
await preloadRouteComponents('/about')
</script>