请说明在 Vue Router 中配置 404 页面的具体做法？

回答思路

1. 【回答框架 1】在 Vue Router 中，404 页面通过配置一个匹配所有未定义路径的路由来实现。通常使用路径通配符，例如 `{ path: '/:pathMatch(.*)*', component: NotFound }`（Vue Router 4）或 `{ path: '*', component: NotFound }`（Vue Router 3），并放在路由配置的最后。
2. 【回答框架 2】路由匹配顺序：Vue Router 按照路由配置的先后顺序进行匹配，将 404 通配路由放在最后，可以确保其他具体路由优先匹配，只有在没有任何路由匹配时才进入 404 页面。
3. 【回答框架 3】在 Vue Router 4 中，通配符语法有所变化，推荐使用 `/:pathMatch(.*)*` 或 `/:pathMatch(.*)`，其中 `*` 表示匹配剩余路径，`.*` 表示任意字符。使用命名参数可以方便地在组件中获取原始路径。
4. 【回答框架 4】注意：如果使用 history 模式，服务器也需要配置回退到 index.html，否则直接访问不存在的路径会返回服务器的 404 而不是前端路由的 404 页面。
5. 【关键点 1】404 路由必须放在路由配置的最后。
6. 【关键点 2】Vue Router 3 使用 `path: '*'`，Vue Router 4 使用 `path: '/:pathMatch(.*)*'`。
7. 【关键点 3】history 模式下需要服务器配置 SPA 回退。
8. 【易错点 1】在 Vue Router 4 中继续使用 `'*'` 会导致匹配问题，应使用 `/:pathMatch(.*)*`。
9. 【易错点 2】只配置前端路由 404 而不处理服务器回退，可能导致生产环境 404 页面异常。
10. 【易错点 3】通配路由不应放在其他路由之前，否则会拦截所有请求。