Next.js已安装Sass仍提示未安装的问题求助

• 检查./src/styles/home.scss的导入与语法
  • 确认组件中对该文件的导入路径无拼写错误，比如相对路径层级是否正确
  • 排查文件内的Sass语法问题，比如未闭合的嵌套规则、错误的变量/混合宏定义，语法错误可能被误报为依赖缺失
• 清理项目缓存与重装依赖
  • 执行Next.js缓存清理：next clean
  • 清理包管理器缓存：
    • npm：npm cache clean --force
    • yarn：yarn cache clean
  • 删除node_modules及锁文件：
    • macOS/Linux：rm -rf node_modules package-lock.json yarn.lock
    • Windows：rmdir /s /q node_modules && del package-lock.json yarn.lock
  • 重新安装依赖：npm install 或 yarn install
• 排查版本兼容性与冲突
  • 确保仅安装sass（而非已废弃的node-sass），若同时存在则卸载node-sass：npm uninstall node-sass 或 yarn remove node-sass
  • 安装与当前Next.js版本兼容的sass版本，例如Next.js 13+可指定：npm install sass@^1.60.0（版本号可根据实际Next.js版本调整）
• 检查文件与配置
  • 确认文件扩展名为.scss（而非语法不同的.sass）
  • 查看next.config.js中的sassOptions配置，若存在includePaths需确保路径指向正确，可暂时注释该配置测试
• 验证依赖安装状态
  • 检查node_modules/sass目录是否存在，若缺失说明安装不完整，需查看安装时的终端报错排查问题
  • 执行npm list sass 或 yarn list sass，确认依赖已正确安装并显示版本号

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