nuxt-3-axios

library1.3.5jsnpmunverified

A Nuxt 3 module that provides a typed Axios instance injected into the Nuxt app context. Version 1.3.5 is the latest stable release; the package is actively maintained and released via GitHub Actions. It integrates Axios out-of-the-box, supports SSR, and offers a simple configuration via nuxt.config.ts. Unlike generic Axios wrappers, it leverages Nuxt 3's auto-import and composition API, delivering a type-safe HTTP client accessible via $axios. The module is lightweight, has no peer dependencies beyond Nuxt 3 and Axios, and is published on npm.

communication

npm install nuxt-3-axios

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · NUXT-3-AXIOS

nuxt-3-axios

communicationjavascriptv1.3.5

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

$axios

✓ const { $axios } = useNuxtApp()

✗ import $axios from 'nuxt-3-axios'

$axios is injected at runtime by the module into the Nuxt app, not imported as a local module. Access it via useNuxtApp()

defineNuxtConfig

✓ import { defineNuxtConfig } from 'nuxt/config'

✗ const defineNuxtConfig = require('nuxt/config')

Define Nuxt config using ESM import; module registration is string-based

module registration

✓ modules: ['nuxt-3-axios']

✗ modules: [require('nuxt-3-axios')]

Modules are registered by name (string) in the modules array of nuxt.config.ts

Shows setup and usage: add module to Nuxt config, configure baseURL, then access typed $axios instance in components via useNuxtApp()

// nuxt.config.ts export default defineNuxtConfig({ modules: ['nuxt-3-axios'], axios: { baseURL: process.env.API_BASE_URL ?? 'https://swapi.dev/api/' } }) // components/Example.vue <script setup lang="ts"> const { $axios } = useNuxtApp() const { data } = await $axios.get('/people/1') console.log(data.name) // Luke Skywalker </script>

Debug

Known issues

breaking$axios is not available during plugin or middleware execution before Nuxt app is mounted

fix

Use useAxios() (if provided) or configure Axios via nuxt.config.ts options only; avoid using $axios in server-side middleware

affects: >=1.0.0

deprecatedThe module does not support Nuxt 2; Nuxt 2 users must use @nuxtjs/axios instead

fix

Migrate to Nuxt 3 or use @nuxtjs/axios for Nuxt 2 projects

affects: >=1.0.0

gotchaAxios config options passed in nuxt.config.ts may be overwritten by user-defined defaults

fix

Use a separate axios property in nuxt.config.ts or set config via useRequestHeaders at runtime

affects: >=1.0.0

breakingThe $axios instance is typed as AxiosInstance but TypeScript errors may occur if Axios version differs from module's peer dependency

fix

Ensure project's Axios version matches the module's peer dependency (>=1.3.0) to avoid type mismatch

affects: >=1.3.0

gotchaUsing $axios outside of setup script in components (e.g., in watch or lifecycle hooks) may require careful use of getCurrentInstance

fix

Access $axios from useNuxtApp() in composition API context; avoid in options API

affects: >=1.0.0

Errors

Common errors & fixes

$axios is not defined

Module not registered or useNuxtApp() called outside setup context

fix

Ensure 'nuxt-3-axios' is added to modules array in nuxt.config.ts and useNuxtApp() is called inside <script setup> or composition functions

Cannot use 'import { $axios } from 'nuxt-3-axios''

Incorrect import; module injects $axios at runtime, not as export

fix

Use const { $axios } = useNuxtApp() to access the injected instance

TypeError: $axios.get is not a function

$axios resolved to undefined because module not loaded or used in wrong lifecycle

fix

Check module is in modules array; call useNuxtApp() after onMounted or in setup with Suspense

The module 'nuxt-3-axios' does not exist or is incompatible

Using Nuxt 2 or incorrect node_modules

fix

Remove package and install @nuxtjs/axios for Nuxt 2; for Nuxt 3, reinstall latest version

Upgrade

Version history

1.3.5latest on npm

Audit

Dependencies

axiosrequiredThe underlying HTTP client used by the module

Agent activity

13 hits · last 30 days

node

OpenAI (training)

Amazon

Resources

githubhttps://github.com/farid-temuri-lofty/nuxt-3-axios#axios-nuxt ↗

packagenuxt-3-axios ↗

homepagehttps://github.com/farid-temuri-lofty/nuxt-3-axios/tree/axios-nuxt#readme ↗