Vue router 셋팅

1. 해당 프로젝트 디렉토리 이동

2. "npm install vue-router@4" 명령어 입력

3. "npm run serve" 실행하기

-------

[router 셋팅]

1. main.js를 다음과 같이 수정

보통 router.js 파일을 만들어서 import 하는 구조로 함.

 

[router.js 생성]

import { createWebHistory, createRouter } from "vue-router";
// vue-router 라이브러리의 변수 createWebHistory, CreateRouter 두개를 사용한다는 의미이다.
import List from "../components/List.vue";
//만들어 놓은 vue파일을 "/list"라고 경로로 왔을 때 보여주기 위해 import함

const routes = [
  {
    path: "/list",
    component: List,
  }
];

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

export default router;