Skip to content

自定义路由

· 1 min

假设当前我们的项目目录结构如下：

pages/
├── index.vue             # 首页
├── about.vue             # 关于页面
├── blog/
│   ├── index.vue         # 博客列表页
│   ├── [id].vue          # 博客详情页

根据该文件结构，能够自动生成如下的路由：

要自定义路由，需在项目中创建一个 app/router.options.ts 文件，并在其中配置路由规则。

app/
├── router.options.ts    # 自定义路由配置文件
pages/
├── 页面组件

其他路由相关配置:

可以在 Nuxt 配置文件中进行配置：

export default defineNuxtConfig({
  router: {
    options: {
      linkActiveClass: 'xxxx',
    },
  },
})

-EOF-