Next.js TypeScript中间件未正常运行，请问我哪里操作有误？

我按照官方文档配置了Next.js中间件，写了最基础的测试代码，预期访问/等路径时控制台能输出消息，但完全没有任何反应。

我的中间件代码 #

import { NextResponse } from 'next/server'

export function middleware(request) {
  console.log('Middleware running')
  return NextResponse.next()
}

export const config = {
  matcher: '/'
}

当前package.json内容 #

{  
  "dependencies": {    
    "@next/swc-darwin-x64": "13.4.4",    
    "eslint-config-next": "13.3.0",    
    "next": "13.3.0",    
    "react": "18.2.0",    
    "react-dom": "18.2.0"  
  },  
  "scripts": {    
    "dev": "next dev",    
    "build": "next build",    
    "start": "next start",    
    "lint": "next list"  
  },  
  "devDependencies": {    
    "@types/node": "18.15.11",    
    "@types/react": "18.0.35"  
  }
}

我已经尝试删除package-lock.json并重新安装所有依赖，但问题依旧。

解决步骤 #

• 检查文件位置：中间件文件必须放在项目根目录或src根目录下，命名为middleware.js/middleware.ts，不能放在pages、app等子文件夹内，否则Next.js无法识别。
• 统一依赖版本：@next/swc-darwin-x64版本（13.4.4）与next版本（13.3.0）不匹配，会导致运行异常。建议移除@next/swc-darwin-x64依赖（Next.js会自动适配对应平台的SWC包），或者将其版本改为13.3.0。
• 修正matcher配置：仅设置matcher: '/'只会匹配根路径的初始请求，后续客户端导航可能不触发。若要匹配所有路径，改为matcher: ['/', '/:path*']。
• 查看正确的控制台：中间件运行在服务器端，控制台输出不会出现在浏览器开发者工具里，要查看终端中next dev的输出日志。
• 修复脚本错误：scripts中的lint命令写错了，应该是next lint而非next list，虽然不影响中间件，但会导致lint功能失效。

调整完成后重启开发服务器，中间件即可正常触发。

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