vue.js - unplugin-vue-router怎么配置？

Question

unplugin-vue-router怎么配置？

报错：[Vue Router warn]: No match found for location with path "/index"

vite.confing.ts

import { fileURLToPath, URL } from 'node:url'import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import VueRouter from 'unplugin-vue-router/vite'// https://vitejs.dev/config/export default defineConfig({  plugins: [    vue(),    VueRouter({      routesFolder: 'src/views',    }),  ],  resolve: {    alias: {      '@': fileURLToPath(new URL('./src', import.meta.url))    }  }})

src/views/index/vue

<script setup lang="ts"></script><template>  index123</template>

Answer 1

首先，你需要确保你已经正确地安装了 unplugin-vue-router。如果没有，你可以通过以下命令进行安装：

npm install unplugin-vue-router --save

然后，你应该按照以下方式配置 unplugin-vue-router：

import { defineConfig } from 'vite'import vue from '@vitejs/plugin-vue'import { VueRouter } from 'unplugin-vue-router'export default defineConfig({  plugins: [    vue(),    VueRouter({      routesFolder: 'src/views',      // other options...    }),  ],  resolve: {    alias: {      '@': fileURLToPath(new URL('./src', import.meta.url))    }  }})

注意：你可能会需要其他 unplugin-vue-router 的选项，根据你的路由和应用程序的需求。请参阅 unplugin-vue-router 的文档以获取更多信息。

对于你的错误 [Vue Router warn]: No match found for location with path "/index"，这是因为你可能没有在 src/views/index/vue 文件中定义一个名为 index 的路由。你应该确保你在 src/views 文件夹中有一个名为 index.vue 的文件，并且在那个文件中定义了一个名为 index 的路由。如果你已经这样做了，但是仍然遇到这个问题，那么问题可能在于你的路由定义或者你的 unplugin-vue-router 配置。