not work with nuxt 3 #536

n4an · 2021-10-13T15:56:47Z

not work with nuxt 3

Eliophot · 2021-10-14T07:42:26Z

Hello, same pb with nuxt3

Cannot restart nuxt:  options is not defined

xiaobai-world · 2021-10-16T15:56:51Z

i got same problem

musacivak · 2021-10-17T00:31:15Z

we can try but same problem again

hiracky16 · 2021-10-22T00:51:00Z

I got a same problem.
I tryed to add this setting to my nuxt config.
This solved this problem but a new error occurred on the client side.

modules: [
    "@nuxtjs/axios"
  ],
  axios: {
    baseURL: 'http://localhost:4000',
    options: {
      headers: {}
    }
  },

xiongsongsong · 2021-10-22T00:58:17Z

I think "@nuxtjs/axios" is not required. because useFetch instead it. although useFetch has some bugs.

hiracky16 · 2021-10-22T03:43:18Z

@xiongsongsong
Thank you. I didn't know that it is possible to use useFetch.
I'll watch for that some bug. 👀

gcming · 2021-10-22T08:17:42Z

@xiongsongsong Thank you. I didn't know that it is possible to use useFetch. I'll watch for that some bug. 👀

There seems to be no other better solution

rnotorni · 2021-10-24T04:23:31Z

I set it as below and updated nuxt3(3.0.0-27247485.fb4359e) and it worked.

  modules: [
    ['@nuxtjs/axios',{proxyHeaders:false}],
  ],

The reason I set proxyHeaders to false is because I get an error that serializer is not defined

https://github.com/nuxt-community/axios-module/blob/main/lib/plugin.js#L210-L219

However, I don't think this has solved it.

andysay · 2021-11-27T08:09:04Z

Cannot restart nuxt: serialize is not defined

Rasul1996 · 2021-11-30T12:38:42Z

Same problem

ShellarFX · 2021-12-05T15:15:15Z

You can temporary turn off proxyHeaders in nuxt.config.ts

modules: ["@nuxtjs/axios"],
axios: {
    proxyHeaders: false,
},

sammyaxe · 2021-12-17T01:18:13Z

In my case I needed to add baseUrl config to get it to work

publicRuntimeConfig: {
        axios: {
            baseURL: '......'
        }
    },
    modules: [
        ['@nuxtjs/axios',{proxyHeaders:false}]
    ],

imamnf · 2021-12-21T03:33:17Z

I get an error like this, I don't know how to solve it.

Nuxt version v3.0.0-27324955.23397e6

sammyaxe · 2021-12-21T03:38:19Z

I get an error like this, I don't know how to solve it.

Nuxt version v3.0.0-27324955.23397e6

please check my answer above, you need to provide baseURL

imamnf · 2021-12-21T03:42:43Z

I get an error like this, I don't know how to solve it.
Nuxt version v3.0.0-27324955.23397e6

please check my answer above, you need to provide baseURL

I've add the baseURL to the config, but still got the error

modules: ["@nuxtjs/axios", {proxyHeaders: false}], publicRuntimeConfig: { axios: { baseURL: process.env.AXIOS_BASE_URL || 'http://localhost:3000/api' } }

rnotorni · 2021-12-21T04:40:04Z

@imamnf

Did you include the following commit?

c539548

Without this commit, even the client will try to get the baseURL on the server side.
Because process.browser is returning false.

axios-module/lib/plugin.js

Lines 196 to 198 in a99b56c

const baseURL = process.client

? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')

: (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')

imamnf · 2021-12-21T04:44:50Z

@imamnf

Did you include the following commit?

c539548

Without this commit, even the client will try to get the baseURL on the server side. Because process.browser is returning false.

axios-module/lib/plugin.js

Lines 196 to 198 in a99b56c

const baseURL = process.client

? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')

: (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')

how to include that? I don't know where the file is

rnotorni · 2021-12-21T05:03:56Z

Sorry.

This hasn't been released yet 🙇

In my case I am using patch-package to modify node_modules/@nuxtjs/axios/lib/plugin.js files

$cat patches/@nuxtjs+axios+5.13.6.patch

diff --git a/node_modules/@nuxtjs/axios/lib/module.js b/node_modules/@nuxtjs/axios/lib/module.js
index 36d41dd..e6f6b96 100755
--- a/node_modules/@nuxtjs/axios/lib/module.js
+++ b/node_modules/@nuxtjs/axios/lib/module.js
@@ -38,9 +38,9 @@ function axiosModule (_moduleOptions) {
   }

   // Transpile defu (IE11)
-  if (nuxt.options.build.transpile /* nuxt 1 */) {
-    nuxt.options.build.transpile.push(({ isClient }) => isClient && 'defu')
-  }
+  // if (nuxt.options.build.transpile /* nuxt 1 */) {
+  //   nuxt.options.build.transpile.push(({ isClient }) => isClient && 'defu')
+  // }

   // Default prefix
   const prefix = process.env.API_PREFIX || moduleOptions.prefix || '/'
diff --git a/node_modules/@nuxtjs/axios/lib/plugin.js b/node_modules/@nuxtjs/axios/lib/plugin.js
index fc4493e..b5388b7 100644
--- a/node_modules/@nuxtjs/axios/lib/plugin.js
+++ b/node_modules/@nuxtjs/axios/lib/plugin.js
@@ -193,9 +193,10 @@ export default (ctx, inject) => {
   // runtimeConfig
   const runtimeConfig = ctx.$config && ctx.$config.axios || {}
   // baseURL
-  const baseURL = process.browser
-    ? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')
-      : (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')
+  const baseURL = '<%= options.baseURL || '' %>'
+  // const baseURL = process.browser
+  //   ? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')
+  //     : (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')

   // Create fresh objects for all default header scopes
   // Axios creates only one which is shared across SSR requests!

BobbieGoede · 2021-12-21T21:05:55Z

Hmm the issue you are talking about should already be fixed by this PR nuxt/framework#516 but there haven't been any releases of the this module since June.

@pi0 is there are reason why changes haven't been released?

rnotorni · 2021-12-22T03:13:45Z

I think nuxt/framework#516 only fixes the problem with the baseURL.

I think there are at least three problems.

serializer is not defined
baseURL
Expected pattern to be a non-empty string (in build)

The baseURL problem happens because process.browser and process.env are undefined in client. We can see this in console.log

Regarding the third, it happens in the following place at build time.

https://github.com/nuxt-community/axios-module/blob/main/lib/module.js#L41-L43

So nuxt/framework#516 will fix the baseURL problem and this issue itself will not be fixed.

bmulholland · 2022-01-22T14:17:14Z

Auth module depends on axios, so that package can't have nuxt 3 support until axios is fixed: nuxt-community/auth-module#1520

bcspragu · 2022-01-26T01:06:14Z

I'm not familiar with what this plugin does, but for someone trying to get axios working quickly with Nuxt 3, you can add a quick plugin, like:

plugins/axios.ts

import { defineNuxtPlugin } from '#app'
import axios from 'axios'

export default defineNuxtPlugin(() => {
  return {
    provide: {
      axios: () => {
        return axios.create({/* configuration here */})
      }
    }
  }
})

And then you can access it like:

Usage example

<script setup lang="ts">
import { useNuxtApp } from '#app'

let { $axios } = useNuxtApp()
const axios = $axios()
axios.get('/req/path/123').then((response) => {
  /* do things with response and response.data */
})
</script>

This works with both SSR and client-side as far as I can tell.

Denoder · 2022-02-03T18:38:51Z

Here's a small module u can use to replicate this module while you guys wait for an update.
You need to install axios, @nuxtjs/proxy, consola, and defu as devDependencies or dependencies for it to work.

I got the proxy plugin working but you have to use it a bit differently, for it to work the same you need to set axios.proxy as true then add a proxy object outside of the axios object with your proxy config (like you would when installing just the proxy module.)

Fixed.

nuxt.config.ts

import { defineNuxtConfig } from 'nuxt3'

// https://v3.nuxtjs.org/docs/directory-structure/nuxt.config
export default defineNuxtConfig({
    // no need to set @nuxtjs/proxy here
    buildModules: [
        '~/modules/nuxt-axios',
    ],
    axios: {
        credentials: true,
        proxy: true // if you want to enable proxy
    },
    proxy: {
        //proxy config
    }
})

/modules/nuxt-axios/index.ts

import defu from 'defu'
import consola from 'consola'
import { resolve } from 'path'
import { defineNuxtModule, addPluginTemplate } from '@nuxt/kit'

const CONFIG_KEY = 'axios'

const logger = consola.withScope('nuxt:axios')

export default defineNuxtModule({
    meta: {
        name: 'nuxt-axios',
        configKey: CONFIG_KEY,
        compatibility: {
            nuxt: '^3.0.0'
        }
    },
    async setup(_moduleOptions, nuxt) {

        // Combine options
        const moduleOptions = {
            ...nuxt.options.axios,
            ..._moduleOptions,
            ...(nuxt.options.runtimeConfig && nuxt.options.runtimeConfig.axios)
        }

        // Default port
        const defaultPort =
            process.env.API_PORT ||
            moduleOptions.port ||
            process.env.PORT ||
            process.env.npm_package_config_nuxt_port ||
            (nuxt.options.server && nuxt.options.server.port) ||
            3000

        // Default host
        let defaultHost =
            process.env.API_HOST ||
            moduleOptions.host ||
            process.env.HOST ||
            process.env.npm_package_config_nuxt_host ||
            (nuxt.options.server && nuxt.options.server.host) ||
            'localhost'

        /* istanbul ignore if */
        if (defaultHost === '0.0.0.0') {
            defaultHost = 'localhost'
        }

        // Transpile defu (IE11)
        if (nuxt.options.build.transpile && process.client/* nuxt 1 */) {
            nuxt.options.build.transpile.push('defu')
        }

        // Default prefix
        const prefix = process.env.API_PREFIX || moduleOptions.prefix || '/'

        // HTTPS
        const https = Boolean(nuxt.options.server && nuxt.options.server.https)

        // Headers
        const headers = {
            common: {
                Accept: 'application/json, text/plain, */*'
            },
            delete: {},
            get: {},
            head: {},
            post: {},
            put: {},
            patch: {}
        }

        // Support baseUrl alternative
        if (moduleOptions.baseUrl) {
            moduleOptions.baseURL = moduleOptions.baseUrl
            delete moduleOptions.baseUrl
        }
        if (moduleOptions.browserBaseUrl) {
            moduleOptions.browserBaseURL = moduleOptions.browserBaseUrl
            delete moduleOptions.browserBaseUrl
        }

        // Apply defaults
        const options = defu(moduleOptions, {
            baseURL: `http://${defaultHost}:${defaultPort}${prefix}`,
            browserBaseURL: undefined,
            credentials: false,
            debug: false,
            progress: true,
            proxyHeaders: true,
            proxyHeadersIgnore: [
                'accept',
                'cf-connecting-ip',
                'cf-ray',
                'content-length',
                'content-md5',
                'content-type',
                'host',
                'if-none-match',
                'if-modified-since',
                'x-forwarded-host',
                'x-forwarded-port',
                'x-forwarded-proto'
            ],
            proxy: false,
            retry: false,
            https,
            headers
        })

        // ENV overrides

        /* istanbul ignore if */
        if (process.env.API_URL) {
            options.baseURL = process.env.API_URL
        }

        /* istanbul ignore if */
        if (process.env.API_URL_BROWSER) {
            options.browserBaseURL = process.env.API_URL_BROWSER
        }

        // Default browserBaseURL
        if (typeof options.browserBaseURL === 'undefined') {
            options.browserBaseURL = options.proxy ? prefix : options.baseURL
        }

        // Normalize options
        if (options.retry === true) {
            options.retry = {}
        }

        // Convert http:// to https:// if https option is on
        if (options.https === true) {
            const https = s => s.replace('http://', 'https://')
            options.baseURL = https(options.baseURL)
            options.browserBaseURL = https(options.browserBaseURL)
        }

        // globalName
        options.globalName = nuxt.options.globalName || 'nuxt'

        // Register plugin
        addPluginTemplate({
            src: resolve(__dirname, 'plugin.ts'),
            filename: 'axios.options.mjs',
            options
        })

        // Proxy integration
        if (options.proxy) {
            nuxt.options.proxy = typeof options.proxy === 'object' ? options.proxy : (typeof nuxt.options.proxy === 'object' ? nuxt.options.proxy : {})
            nuxt['__module_container__'].requireModule('@nuxtjs/proxy')
        }

        // Set _AXIOS_BASE_URL_ for dynamic SSR baseURL
        process.env._AXIOS_BASE_URL_ = options.baseURL

        logger.debug(`baseURL: ${options.baseURL}`)
        logger.debug(`browserBaseURL: ${options.browserBaseURL}`)
    }
})

/modules/nuxt-axios/plugin.ts

import { defineNuxtPlugin } from '#app'
import Axios from 'axios'
import defu from 'defu'
'<% if (options.retry) { %>'
import axiosRetry from 'axios-retry'
'<% } %>'

// Axios.prototype cannot be modified
const axiosExtra = {
    setBaseURL(baseURL) {
        this.defaults.baseURL = baseURL
    },
    setHeader(name, value, scopes = 'common') {
        for (const scope of Array.isArray(scopes) ? scopes : [scopes]) {
            if (!value) {
                delete this.defaults.headers[scope][name];
                continue
            }
            this.defaults.headers[scope][name] = value
        }
    },
    setToken(token, type, scopes = 'common') {
        const value = !token ? null : (type ? type + ' ' : '') + token
        this.setHeader('Authorization', value, scopes)
    },
    onRequest(fn) {
        this.interceptors.request.use(config => fn(config) || config)
    },
    onResponse(fn) {
        this.interceptors.response.use(response => fn(response) || response)
    },
    onRequestError(fn) {
        this.interceptors.request.use(undefined, error => fn(error) || Promise.reject(error))
    },
    onResponseError(fn) {
        this.interceptors.response.use(undefined, error => fn(error) || Promise.reject(error))
    },
    onError(fn) {
        this.onRequestError(fn)
        this.onResponseError(fn)
    },
    create(options) {
        return createAxiosInstance(defu(options, this.defaults))
    }
}

// Request helpers ($get, $post, ...)
for (const method of ['request', 'delete', 'get', 'head', 'options', 'post', 'put', 'patch']) {
    axiosExtra['$' + method] = function () { return this[method].apply(this, arguments).then(res => res && res.data) }
}

const extendAxiosInstance = axios => {
    for (const key in axiosExtra) {
        axios[key] = axiosExtra[key].bind(axios)
    }
}

const createAxiosInstance = axiosOptions => {
    // Create new axios instance
    const axios = Axios.create(axiosOptions)
    axios.CancelToken = Axios.CancelToken
    axios.isCancel = Axios.isCancel
    axios.isAxiosError = Axios.isAxiosError

    // Extend axios proto
    extendAxiosInstance(axios)

    // Intercept to apply default headers
    axios.onRequest((config) => {
        config.headers = { ...axios.defaults.headers.common, ...config.headers }
    })

    // Setup interceptors
    '<% if (options.debug) { %>'; setupDebugInterceptor(axios); '<% } %>'
    '<% if (options.credentials) { %>'; setupCredentialsInterceptor(axios); '<% } %>'
    '<% if (options.progress) { %>'; setupProgress(axios); '<% } %>'
    '<% if (options.retry) { %>'; axiosRetry(axios, JSON.parse('<%= JSON.stringify(options.retry) %>')); '<% } %>'

    return axios
}

'<% if (options.debug) { %>'
const log = (level, ...messages) => console[level]('[Axios]', ...messages)

const setupDebugInterceptor = axios => {
    // request
    axios.onRequestError(error => {
        log('error', 'Request error:', error)
    })

    // response
    axios.onResponseError(error => {
        log('error', 'Response error:', error)
    })
    axios.onResponse(res => {
        log(
            'info',
            '[' + (res.status + ' ' + res.statusText) + ']',
            '[' + res.config.method.toUpperCase() + ']',
            res.config.url)

        if (process.client) {
            console.log(res)
        } else {
            console.log(JSON.stringify(res.data, undefined, 2))
        }

        return res
    })
}
'<% } %>'

'<% if (options.credentials) { %>'
const setupCredentialsInterceptor = axios => {
    // Send credentials only to relative and API Backend requests
    axios.onRequest(config => {
        if (config.withCredentials === undefined) {
            if (!/^https?:\/\//i.test(config.url) || config.url.indexOf(config.baseURL) === 0) {
                config.withCredentials = true
            }
        }
    })
}
'<% } %>'

'<% if (options.progress) { %>'
const setupProgress = (axios) => {
    if (process.server) {
        return
    }

    // A noop loading inteterface for when $nuxt is not yet ready
    const noopLoading = {
        finish: () => { },
        start: () => { },
        fail: () => { },
        set: () => { }
    }

    const $loading = () => {
        const $nuxt = typeof window !== 'undefined' && window['$<%= options.globalName %>']
        return ($nuxt && $nuxt.$loading && $nuxt.$loading.set) ? $nuxt.$loading : noopLoading
    }

    let currentRequests = 0

    axios.onRequest(config => {
        if (config && config.progress === false) {
            return
        }

        currentRequests++
    })

    axios.onResponse(response => {
        if (response && response.config && response.config.progress === false) {
            return
        }

        currentRequests--
        if (currentRequests <= 0) {
            currentRequests = 0
            $loading().finish()
        }
    })

    axios.onError(error => {
        if (error && error.config && error.config.progress === false) {
            return
        }

        currentRequests--

        if (Axios.isCancel(error)) {
            if (currentRequests <= 0) {
                currentRequests = 0
                $loading().finish()
            }
            return
        }

        $loading().fail()
        $loading().finish()
    })

    const onProgress = e => {
        if (!currentRequests || !e.total) {
            return
        }
        const progress = ((e.loaded * 100) / (e.total * currentRequests))
        $loading().set(Math.min(100, progress))
    }

    axios.defaults.onUploadProgress = onProgress
    axios.defaults.onDownloadProgress = onProgress
}
'<% } %>'

export default defineNuxtPlugin(ctx => {
    // runtimeConfig
    const runtimeConfig = ctx.$config && ctx.$config.axios || {}

    // baseURL
    const baseURL = process.client
        ? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL %>' || '')
        : (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL %>' || '')

    // Create fresh objects for all default header scopes
    // Axios creates only one which is shared across SSR requests!
    // https://github.com/mzabriskie/axios/blob/master/lib/defaults.js
    const headers = JSON.parse('<%= JSON.stringify(options.headers) %>')

    const axiosOptions = {
        baseURL,
        headers
    }

    '<% if (options.proxyHeaders) { %>'
    // Proxy SSR request headers
    if (process.server && ctx.ssrContext.req && ctx.ssrContext.req.headers) {
        const reqHeaders = { ...ctx.ssrContext.req.headers }
        for (const h of '<%= options.proxyHeadersIgnore %>'.split(',')) {
            delete reqHeaders[h]
        }
        axiosOptions.headers.common = { ...reqHeaders, ...axiosOptions.headers.common }
    }
    '<% } %>'

    if (process.server) {
        // Don't accept brotli encoding because Node can't parse it
        axiosOptions.headers.common['accept-encoding'] = 'gzip, deflate'
    }

    const axios = createAxiosInstance(axiosOptions)

    ctx.vueApp.provide('axios', axios);
    ctx.provide('axios', axios);
})

lacorde · 2022-02-11T15:54:13Z

I can testify, @bcspragu's proposal works like a charm !

Either way, some other community modules such as the nuxt-community/auth-module are waiting for this update to start migrating to Nuxt 3 themselves. Would love to see @teranode's fix tested, and hopefully included.

Benyaminrmb · 2022-02-15T13:14:17Z

Sorry.

This hasn't been released yet 🙇

In my case I am using patch-package to modify node_modules/@nuxtjs/axios/lib/plugin.js files

$cat patches/@nuxtjs+axios+5.13.6.patch

diff --git a/node_modules/@nuxtjs/axios/lib/module.js b/node_modules/@nuxtjs/axios/lib/module.js
index 36d41dd..e6f6b96 100755
--- a/node_modules/@nuxtjs/axios/lib/module.js
+++ b/node_modules/@nuxtjs/axios/lib/module.js
@@ -38,9 +38,9 @@ function axiosModule (_moduleOptions) {
   }

   // Transpile defu (IE11)
-  if (nuxt.options.build.transpile /* nuxt 1 */) {
-    nuxt.options.build.transpile.push(({ isClient }) => isClient && 'defu')
-  }
+  // if (nuxt.options.build.transpile /* nuxt 1 */) {
+  //   nuxt.options.build.transpile.push(({ isClient }) => isClient && 'defu')
+  // }

   // Default prefix
   const prefix = process.env.API_PREFIX || moduleOptions.prefix || '/'
diff --git a/node_modules/@nuxtjs/axios/lib/plugin.js b/node_modules/@nuxtjs/axios/lib/plugin.js
index fc4493e..b5388b7 100644
--- a/node_modules/@nuxtjs/axios/lib/plugin.js
+++ b/node_modules/@nuxtjs/axios/lib/plugin.js
@@ -193,9 +193,10 @@ export default (ctx, inject) => {
   // runtimeConfig
   const runtimeConfig = ctx.$config && ctx.$config.axios || {}
   // baseURL
-  const baseURL = process.browser
-    ? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')
-      : (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')
+  const baseURL = '<%= options.baseURL || '' %>'
+  // const baseURL = process.browser
+  //   ? (runtimeConfig.browserBaseURL || runtimeConfig.browserBaseUrl || runtimeConfig.baseURL || runtimeConfig.baseUrl || '<%= options.browserBaseURL || '' %>')
+  //     : (runtimeConfig.baseURL || runtimeConfig.baseUrl || process.env._AXIOS_BASE_URL_ || '<%= options.baseURL || '' %>')

   // Create fresh objects for all default header scopes
   // Axios creates only one which is shared across SSR requests!

its still not working

tntsoft · 2022-02-18T05:27:12Z

Any news on this? Maybe someone can review the @teranode pull request.

@pi0 could you please assist (not sure who to tag)?

nuxt/auth is dependent on this, and it's quite a pain to rewrite that authentication package in nuxt 3.

Denoder · 2022-02-18T10:35:35Z

@tntsoft
You could try using these packages until they update theirs: https://github.com/Teranode/nuxt-module-alternatives

paleacci · 2022-03-07T07:30:01Z

create plugins/axios.js and add this code inside

`import axios from 'axios'

export default () => {
return {
provide: {
axios: axios.default
}
}
}
`

then you can use this.$axios

lacorde · 2022-04-04T09:59:06Z

Seems like the upgrade is quite straightforward according to @teranode, @bcspragu or @paleacci.

A first step could be to create a "next" branch that would allow axios-dependent projects to start migrating to Nuxt 3 ?

kissu · 2022-08-08T13:22:14Z

You don't really need that package anymore, ohmyfetch is the recommended approach anyway: https://v3.nuxtjs.org/api/utils/$fetch#fetch

gromann · 2022-11-30T09:44:55Z

I had the same issue and fixed it by building my own plugin using the normal axios npm module
(advantage: you can build multiple plugins for multiple APIs and defining interceptors is pretty straight forward)
I have described the steps you need in this article
I hope that helps.

robertpatrick · 2023-08-05T15:35:25Z

This module does not work with Nuxt 3 (see discussion in #562). It seems that the author is not interested in making a real Nuxt 3 version of this module and is instead recommending the use of $fetch.

kissu · 2023-08-05T17:41:42Z

@robertpatrick here is my answer: https://stackoverflow.com/a/74966587/8816585

Basically, you don't need to use it anymore because it's included + lightweight (and with better support) because part of the unJS ecosystem. 👌🏻

Lycoon mentioned this issue Feb 1, 2022

Nuxt3: serialize is not defined #560

Open

Denoder mentioned this issue Feb 2, 2022

fix: Nuxt 3 Compatibility #561

Closed

Denoder mentioned this issue Feb 5, 2022

fix: Nuxt3 module & plugin #562

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

not work with nuxt 3 #536

not work with nuxt 3 #536

n4an commented Oct 13, 2021

Eliophot commented Oct 14, 2021

xiaobai-world commented Oct 16, 2021

musacivak commented Oct 17, 2021

hiracky16 commented Oct 22, 2021

xiongsongsong commented Oct 22, 2021 •

edited

Loading

hiracky16 commented Oct 22, 2021

gcming commented Oct 22, 2021

rnotorni commented Oct 24, 2021 •

edited

Loading

andysay commented Nov 27, 2021

Rasul1996 commented Nov 30, 2021

ShellarFX commented Dec 5, 2021

sammyaxe commented Dec 17, 2021

imamnf commented Dec 21, 2021 •

edited

Loading

sammyaxe commented Dec 21, 2021

imamnf commented Dec 21, 2021 •

edited

Loading

rnotorni commented Dec 21, 2021

imamnf commented Dec 21, 2021

rnotorni commented Dec 21, 2021 •

edited

Loading

BobbieGoede commented Dec 21, 2021

rnotorni commented Dec 22, 2021 •

edited

Loading

bmulholland commented Jan 22, 2022

bcspragu commented Jan 26, 2022

Denoder commented Feb 3, 2022 •

edited

Loading

lacorde commented Feb 11, 2022 •

edited

Loading

Benyaminrmb commented Feb 15, 2022

tntsoft commented Feb 18, 2022

Denoder commented Feb 18, 2022

paleacci commented Mar 7, 2022

lacorde commented Apr 4, 2022

kissu commented Aug 8, 2022

gromann commented Nov 30, 2022

robertpatrick commented Aug 5, 2023 •

edited

Loading

kissu commented Aug 5, 2023

not work with nuxt 3 #536

not work with nuxt 3 #536

Comments

n4an commented Oct 13, 2021

Eliophot commented Oct 14, 2021

xiaobai-world commented Oct 16, 2021

musacivak commented Oct 17, 2021

hiracky16 commented Oct 22, 2021

xiongsongsong commented Oct 22, 2021 • edited Loading

hiracky16 commented Oct 22, 2021

gcming commented Oct 22, 2021

rnotorni commented Oct 24, 2021 • edited Loading

andysay commented Nov 27, 2021

Rasul1996 commented Nov 30, 2021

ShellarFX commented Dec 5, 2021

sammyaxe commented Dec 17, 2021

imamnf commented Dec 21, 2021 • edited Loading

sammyaxe commented Dec 21, 2021

imamnf commented Dec 21, 2021 • edited Loading

rnotorni commented Dec 21, 2021

imamnf commented Dec 21, 2021

rnotorni commented Dec 21, 2021 • edited Loading

BobbieGoede commented Dec 21, 2021

rnotorni commented Dec 22, 2021 • edited Loading

bmulholland commented Jan 22, 2022

bcspragu commented Jan 26, 2022

Denoder commented Feb 3, 2022 • edited Loading

lacorde commented Feb 11, 2022 • edited Loading

Benyaminrmb commented Feb 15, 2022

tntsoft commented Feb 18, 2022

Denoder commented Feb 18, 2022

paleacci commented Mar 7, 2022

lacorde commented Apr 4, 2022

kissu commented Aug 8, 2022

gromann commented Nov 30, 2022

robertpatrick commented Aug 5, 2023 • edited Loading

kissu commented Aug 5, 2023

xiongsongsong commented Oct 22, 2021 •

edited

Loading

rnotorni commented Oct 24, 2021 •

edited

Loading

imamnf commented Dec 21, 2021 •

edited

Loading

imamnf commented Dec 21, 2021 •

edited

Loading

rnotorni commented Dec 21, 2021 •

edited

Loading

rnotorni commented Dec 22, 2021 •

edited

Loading

Denoder commented Feb 3, 2022 •

edited

Loading

lacorde commented Feb 11, 2022 •

edited

Loading

robertpatrick commented Aug 5, 2023 •

edited

Loading