본문 바로가기

트러블 슈팅

route의 path가 mis matching일때, 404 에러 화면으로 이동하기

const routes = [
	{
		path: '/',
		name: 'HomeRedirect',
		redirect: '/Home',
	},
	{
		//홈
		path: '/Home',
		name: 'Home',
		component: Home,
	},

	{
		// 404 페이지
		path: '/404',
		name: '404',
		component: Notfound404,
	},
	{
		// 존재하지 않는 페이지 404로 리다이렉트
		path: '/:pathMatch(.*)*',
		redirect: '/404',
	},
];

 예를 들어 여기서는 path가 /Home 밖에 없는데 /Map을 입력하게 되면 해당페이지가 없기 때문에 404로 리다이렉트를 해주는 방법이다. 유저의 사용패턴이 잘못 될 수 있기 때문에 예외처리로 404페이지를 만들어두면 좋다.