React项目构建报错：SassError: Undefined variable.$primary-text-emphasis-dark

问题分析 #

本地npm start正常，但Jenkins执行npm run build时报错，核心原因通常是依赖版本不一致或构建环境的严格解析规则触发了旧版Sass的兼容性问题：

• Bootstrap 5.0.x对Sass版本有最低要求，且1.32.1存在模块导入相关的小bug
• Jenkins环境可能缓存了旧依赖，或Node版本与本地不匹配

具体解决步骤 #

1. 强制同步依赖版本
   在Jenkins构建脚本中添加清理缓存的步骤，避免依赖不一致：

   rm -rf node_modules package-lock.json
   npm install
   

   确保Jenkins使用的package-lock.json和本地完全一致，避免自动升级依赖。

2. 升级Sass版本
   Bootstrap 5.0.2在Sass 1.32.1下存在部分语法解析问题，建议升级到1.33.0及以上稳定版本：

   npm install sass@^1.33.0 --save-dev
   

   新版Sass修复了模块导入的兼容性问题，能正确解析Bootstrap的SCSS变量和混合宏。

3. 检查Bootstrap导入路径
   若使用自定义SCSS导入Bootstrap，确保路径正确。避免使用~前缀（部分旧版sass-loader对~的解析在构建模式下有问题），改用相对路径：

   // 替换之前的 @import "~bootstrap/scss/bootstrap";
   @import "../node_modules/bootstrap/scss/bootstrap";
   

   路径根据你的SCSS文件所在位置调整。

4. 统一Node.js版本
   确保Jenkins环境的Node.js版本和本地开发环境一致（比如使用nvm指定版本），版本差异可能导致依赖安装或构建时的隐藏问题。

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