Gulp报错TypeError: sass is not a function，切换Dart Sass后失效

架构老林

2026-8-16

解决gulp-sass搭配Dart Sass时出现TypeError: sass is not a function的问题

问题原因

你遇到的错误是因为gulp-sass的导入逻辑发生了变更：现在它不再内置Sass编译器（不管是node-sass还是Dart Sass），必须手动传入你安装的Dart Sass实例才能正常调用。同时你的Node.js版本（10.13.0）较旧，需要安装适配该版本的gulp-sass和Dart Sass版本。

解决步骤

1. 安装兼容版本的依赖

由于你使用Node.js 10.13.0，需安装对该版本兼容的gulp-sass和Dart Sass：

# 先卸载旧的相关依赖（如果之前安装过）
npm uninstall gulp-sass node-sass

# 安装兼容版本
npm install gulp-sass@4.1.1 sass@1.32.13 --save-dev

2. 修正gulpfile中的导入语句

将原来的sass导入代码，修改为需要传入Dart Sass实例的形式：

// 替换原来的 const sass = require('gulp-sass');
const sass = require('gulp-sass')(require('sass'));

3. 调整Sass配置参数

Dart Sass不支持node-sass的cache参数，需替换为cacheLocation：

function scss () {
    return src(`${__dirname}/.../*.scss`)
        .pipe(sass({
            outputStyle: 'expanded',
            cacheLocation: '/tmp/sass-cache' // 替换原有的cache参数
        }).on('error', sass.logError))
        .pipe(postcss([ autoprefixer() ]))
        .pipe(dest('System/cache'));
}