如何在Nuxt 3中禁用[Vue router warn]路由警告？

有两种实用方法可以屏蔽你遇到的这类路由匹配警告：

方法一：通过Nuxt配置文件全局过滤 #

在项目根目录的nuxt.config.ts里，添加vueRouter配置项，自定义警告处理逻辑，只过滤掉指定的警告：

export default defineNuxtConfig({
  vueRouter: {
    warnHandler: (msg, vm, trace) => {
      // 只跳过"No match found for location"相关警告，保留其他警告
      if (!msg.includes('No match found for location')) {
        console.warn(msg, vm, trace)
      }
    }
  }
})

方法二：通过Nuxt插件修改Router实例 #

如果需要更灵活的控制，可以创建一个插件来覆盖Router的警告函数：

1. 在项目的plugins目录下新建router-warn-filter.ts文件：

export default defineNuxtPlugin((nuxtApp) => {
  const originalWarn = nuxtApp._router?.warn
  if (originalWarn) {
    nuxtApp._router.warn = (msg) => {
      // 过滤路由匹配失败的警告
      if (!msg.includes('No match found for location')) {
        originalWarn(msg)
      }
    }
  }
})

2. 无需额外配置，Nuxt会自动加载plugins目录下的插件文件。

如果想彻底禁用所有Vue Router警告，直接把方法里的判断逻辑去掉，不调用原警告函数即可。

内容的提问来源于stack exchange，提问作者uiHellen