nuxt 프로젝트에 axios 적용

프로젝트를 생성할때 axios 모듈을 선택한다면 큰 문제는 없지만

기존 프로젝트에 $axios 를 통해 context에 바로 접근하기 위해서는 몇가지 설정이 필요하다.

 

// nuxt.config.js

modules: [
	"@nuxtjs/axios"
],

// nuxt.config.js

axios: {
    // Workaround to avoid enforcing hard-coded localhost:3000: https://github.com/nuxt-community/axios-module/issues/308
    baseURL: '/',
},

 

위와 같이 설정하면

axios 를 import 할 필요없이 

$axios로 바로 사용할 수 있지만,

 

아래와 같은 에러가 발생했다.

 

import axios from 'axios' 를 쓰는 것과

require('axios')

위 두가지를 혼용해서 쓴다는 의미인거 같은데 쉽게 이해되진 않았다. 

 

해결하기 위해 구글링을 하다

이러한 코멘트를 찾았고

axios@0.21.1을 설치하니 해결되었다.

npm i axios@0.21.1

yarn add axios@0.21.1

 

 

출처

https://github.com/axios/axios/issues/5091