使用Gulp执行styles任务时出现premature close错误，求排查解决

问题描述 #

搭建网站使用Gulp构建，styles任务无法正常运行，终端报错信息：

[17:20:24] Using gulpfile C:\projects\basic-telematics\gulpfile.js
[17:20:24] Starting 'styles'...
[17:20:24] 'styles' errored after 82 ms
[17:20:24] Error: premature close
    at onclosenexttick (C:\projects\basic-telematics\node_modules\end-of-stream\index.js:53:86)
    at process.processTicksAndRejections (node:internal/process/task_queues:77:11)

使用的gulpfile.js代码：

const {src, dest} = require('gulp')


const scss = require('gulp-sass')(require('sass'))


function styles() {
    return src('#source/scss/style.scss')
        .pipe(scss())
        .pipe(dest('css/style.min.css'))
}



exports.styles = styles;

问题原因与解决方案 #

报错premature close本质是流处理提前中断，核心是两处路径配置错误：

• 源文件路径错误：src('#source/scss/style.scss')中的#是无效字符，会导致Gulp无法定位到SCSS源文件。需去掉#，根据项目实际结构调整路径，比如项目根目录下存在source文件夹，应改为src('./source/scss/style.scss')。
• 输出路径配置错误：dest('css/style.min.css')的用法错误，dest()的参数应为目标目录，而非具体文件名。当前写法会让Gulp尝试将文件输出到名为style.min.css的目录中，引发流异常。

修正后的代码示例 #

场景1：仅编译SCSS到CSS目录

const {src, dest} = require('gulp')
const scss = require('gulp-sass')(require('sass'))

function styles() {
    return src('./source/scss/style.scss') // 修正源路径
        .pipe(scss())
        .pipe(dest('css')) // 输出到css目录，文件名保持style.css
}

exports.styles = styles;

场景2：编译+压缩+重命名为min.css

先安装所需插件：

npm install gulp-rename gulp-clean-css --save-dev

修改gulpfile.js：

const {src, dest} = require('gulp')
const scss = require('gulp-sass')(require('sass'))
const rename = require('gulp-rename')
const cleanCSS = require('gulp-clean-css')

function styles() {
    return src('./source/scss/style.scss')
        .pipe(scss())
        .pipe(cleanCSS()) // 压缩CSS代码
        .pipe(rename('style.min.css')) // 重命名为style.min.css
        .pipe(dest('css')) // 输出到css目录
}

exports.styles = styles;

额外检查 #

确认项目中确实存在source/scss/style.scss文件，路径大小写在Windows系统中不敏感，但建议保持与代码中一致，避免路径匹配失败。

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