Vue3 Router 설정 방법

1. Vue Router 설치하기
   먼저, Vue Router를 설치해야 합니다. npm을 사용하여 다음과 같이 설치할 수 있습니다.

npm install vue-router@4.0.0-0

• 버전을 명시해야 한다.

2. 라우터 설정 파일 만들기
   Vue Router를 사용하기 위해서는 라우터 설정 파일을 만들어야 합니다. src/router/index.js와 같은 파일을 만들고 다음과 같이 작성합니다.

import { createRouter, createWebHistory } from 'vue-router'
import Home from '@/views/Home.vue'

const routes = [
    {
        path: '/',
        redirect: '/news'
    },
    {
        path: '/news',
        component: NewsView
    },
    {
        path: '/jobs',
        component: JobsView
    },
    {
        path: '/ask',
        component: AskView
    },
]

const router = createRouter({
  history: createWebHistory(),
  routes
})

export default router

3. main.js에서 라우터 설정하기
   마지막으로 main.js에서 라우터를 설정합니다. src/main.js와 같은 파일에서 다음과 같이 작성합니다.

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'

createApp(App).use(router).mount('#app')