설정

현재 존재하는 모든 설정 옵션과 그에 대응하는 기본값 을 살펴보세요:

import VueRouter from 'vue-router/vite'

VueRouter({
  // 어떤 폴더를 어떤 방식으로 스캔할지
  routesFolder: [
    {
      src: 'src/pages',
      path: '',
      // 전역 설정을 재정의합니다
      exclude: excluded => excluded,
      filePatterns: filePatterns => filePatterns,
      extensions: extensions => extensions,
    },
  ],

  // 어떤 파일을 페이지로 간주할지
  extensions: ['.vue'],

  // 포함할 파일
  filePatterns: ['**/*'],

  // 스캔에서 제외할 파일
  exclude: [],

  // 타입을 생성할 위치
  dts: './typed-router.d.ts',

  // 라우트 이름을 생성하는 방법
  getRouteName: routeNode => getFileBasedRouteName(routeNode),

  // <route> 커스텀 블록의 기본 언어
  routeBlockLang: 'json5',

  // 라우트를 import하는 방법, 문자열도 가능
  importMode: 'async',

  // 경로의 기준 위치
  root: process.cwd(),

  // 경로 파서 옵션
  pathParser: {
    // `users.[id]`를 `users/:id`로 파싱할까요?
    dotNesting: true,
  },

  // 라우트를 개별적으로 수정합니다
  async extendRoute(route) {
    // ...
  },

  // 파일로 쓰기 전에 라우트를 수정합니다
  async beforeWriteFiles(rootRoute) {
    // ...
  },
})

SSR

개발 모드에서는 vite.config.js에서 vue-router를 noExternal로 표시해야 할 수도 있습니다:

import { defineConfig } from 'vite'
import Vue from '@vitejs/plugin-vue'
import VueRouter from 'vue-router/vite'

export default defineConfig(({ mode }) => ({
  ssr: {
    noExternal: mode === 'development' ? ['vue-router'] : [],
  },
  plugins: [VueRouter(), Vue()],
}))

설정 ​

SSR ​

설정

SSR