라우트(view파일.vue) 관리

Question

사이트를 개발하다보면 화면수가 당연히 많아 질텐데요 그에따라 등록되는 컴포넌트 (router 개수)가 늘어(등록)나면 그만큼 index.js 파일에는 import homewiew1 from /path /homewiew1 .vue import abcwiew2 from /path/homewiew2 .vue import defwiew 3from /path/homewiew3 .vue import zzzwiew f4rom /path/homewiew4 .... 계속....   (화면수가 늘어나면 아주 많이 생기면 ㅎㅎㅎ 그때마다 파일 라인수가 몇백줄..아니 몇천줄....몇만줄이 퇼텐테.. ( 설마 몇만줄은 ㅎㅎㅎ) ex: 라우터(component) 100개 ....   늘어나는 component를 특별히 관리하는 방법이 있는지요? -   ( ..따로 파일이나 폴더로 분리 한다던지... index.js(main.js)라는 파일은 원래 라우터(component)를   등록하는 파일인지. ....ㅎㅎ ) - index.js 라인수가 당연히 증가 const routes = [ { path: '/' compoennt: hellovew; }, path: '/' compoennt: hellovew; }, ... 등록     늘어나는 라우터(화면 componet) 등록/관리는 방법을 여쭤 봅니다.   이상하네.... 전에 질문드렸는데... ㅠㅠ;; 삭제가 ... 없어 졌습니다. 설명이 부족하면 다시 작성 하겠습니다. (죄송합니다.) 짱^^ 코딩님... 설명 좀...ㅠㅠ;

짐코딩 · Answer

같은 질문이 있어 답변드립니다. 안녕하세요 :) 제가 질문을 100% 이해를 하지못한점 우선 양해부탁드립니다. 아마 궁금하신 점이 제가 이해한바로는 "많은 페이지가 있을 때 어떻게 효과적으로 라우트정보를 관리할까?" 라는 의문 같아서요. 모듈 단위로 관리 : 대메뉴, 중메뉴 또는 업무 도메인 별로 모듈로 분리해서 관리할 수 있을거 같아요. 자동 라우팅 패키지 설치 : 자동 라우팅 모듈을 설치하여 따로 관리가 필요 없도록 하는 것도 좋은 방법인 거 같습니다. 참고로 신규강의인 Vue3 & Firebase 커뮤니티 만들기 강의 는 자동 라우팅 모듈을 설치해서 사용합니다. 추가로 말씀드리면 라우터 파일(router/index.js)도 일반 자바스크립트와 동일하게 생각하시면 됩니다. 코드의 양이 늘어나면 파일로 분리해서 관리하시면 돼요. router /routes.js // 이곳에서 라우트 설정하시고 /index.js // 이곳에서 routes.js 모듈을 불러와 설정하면 되겠죠? 또는 router /routes-a.js /routes-b.js // 이와 같이 별도로 분리하셔도 돼요. /index.js // 마찬가지로 여기서 import 해서 사용하시면 되고요.