React+Vite+Sass项目运行报错：Preprocessor dependency "sass" failed to load求助

云原生阿岚

2026-7-8

解决Vite+React项目中Sass依赖加载报错：Cannot read properties of undefined (reading 'pop')

这个报错本质是Sass预处理器加载失败，大概率是依赖安装问题、版本不兼容或者缓存冲突导致的，按下面的步骤逐一排查解决：

1. 重新安装兼容版本的Sass

Vite对Sass版本有适配要求，旧版本可能出现这类加载错误：

先卸载现有Sass依赖：
```
npm uninstall sass
```
安装最新稳定版Sass（或指定兼容版本如1.69.5）：
```
npm install sass --save-dev
```

2. 清理依赖缓存并重装所有包

有时候node_modules里的依赖损坏或版本冲突会引发问题：

删除node_modules目录和package-lock.json文件：

macOS/Linux：
```
rm -rf node_modules package-lock.json
```

Windows：

rmdir /s /q node_modules && del package-lock.json

重新安装所有依赖：
```
npm install
```
再次启动开发服务：
```
npm run dev
```

3. 检查Vite配置文件是否有误

确认vite.config.js里的CSS预处理器配置没有语法错误，比如路径写错、配置项格式不对：

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  css: {
    preprocessorOptions: {
      scss: {
        // 这里的配置确保没有拼写错误或无效路径，比如全局变量导入要写对路径
        // additionalData: `@import "./src/styles/variables.scss";`
      }
    }
  }
})