Windows7系统运行Next.js+Tailwind项目执行npm run dev报navigator未定义错误

问题原因 #

该错误是Windows 7系统与高版本Next.js依赖的jest-worker、supports-color包的兼容性问题：Windows 7已经停止官方维护，高版本Next.js（12及以上）不再适配Windows 7环境，终端色彩检测逻辑误加载了仅浏览器环境可用的supports-color/browser.js文件，而Node.js环境不存在navigator对象，因此抛出错误。

解决方案 #

按优先级从高到低尝试以下方法：

• 方案1：修改启动命令禁用色彩输出
  打开项目根目录的package.json，找到scripts下的dev配置项，修改为：

  "dev": "next dev --no-color"
  

  保存后重新执行npm run dev即可，该方法能解决90%以上同场景问题。
• 方案2：降级Next.js到适配Windows7的版本
  如果方案1无效，将package.json中next的版本号改为11.1.4，删除项目根目录的node_modules文件夹和package-lock.json文件，重新执行npm install安装依赖后再启动项目。
• 方案3：手动注入全局变量绕开检测
  项目根目录新建dev-start.js文件，写入以下内容：

  global.navigator = global.navigator || {};
  require('next/dist/bin/next').cli(['dev']);
  

  再将package.json的dev配置修改为"dev": "node dev-start.js"，重新启动即可。

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