Nuxt 301 Redirect 처리하는 방법 (Handling Redirects in Nuxt.js)

301 Redirect 처리를 위해서 Nuxt redirect-module을 설치합니다.

설치

npm install @nuxtjs/redirect-module
// or
yarn add @nuxtjs/redirect-module

nuxt.config.js 설정

{
  modules: [
    ['@nuxtjs/redirect-module', {
      // Redirect option here
    }]
  ]
}

 

최상위에서도 사용 가능합니다.

{
  modules: [
    '@nuxtjs/redirect-module'
  ],
  redirect: [
    // Redirect options here
  ]
}

 

사용방법

redirect: [
  { from: '/test1', to: '/test2' }
]

from이 현재 url 그리고 to가 보낼 url을 나타냅니다.

 

redirect: [
  { from: '^/myoldurl', to: '/mynewurl', statusCode: 301 }
]

statueCode도 설정이 가능합니다. 원하는 코드 (301, 302)

 

좀 더 많은 정보를 얻고 싶으시다면 @nuxtjs/redirect-module 라이브러리를 참고하시면 될 것 같습니다.

 

Vue와 연관된 글 중에 이런 글은 어때요?

 

Vue CLI 3에서 custom dotenv 활용하는 방법

vue.js Event Bus를 통해 컴포넌트간 통신하기 (Event Bus in Vue.js)

Nuxt.js x Contentful x Netlify로 static blog 개발하기 1강

Nuxt.js x Contentful x Netlify로 static blog 개발하기 2강

Nuxt.js x Contentful x Netlify로 static blog 개발하기 3강

Nuxt 301 Redirect 처리하는 방법 (Handling Redirects in Nuxt.js)