gulp-sass 5编译后无法将文件写入目标目录该如何解决?
gulp-sass 5 编译无输出文件的解决方案
- 问题核心:gulp-sass 从v5版本开始不再内置sass编译内核,未绑定编译器的情况下sass()方法不会执行实际编译逻辑,自然不会生成输出文件。
- 解决步骤:
- 先安装独立的sass编译器,官方推荐使用dart-sass(已废弃的node-sass不建议使用),执行安装命令:
npm install sass --save-dev - 修改gulpfile.js中gulp-sass的引入代码,完成编译器绑定:
原有引入写法:
调整为绑定安装的sass内核:const sass = require('gulp-sass');const sass = require('gulp-sass')(require('sass')); - 先安装独立的sass编译器,官方推荐使用dart-sass(已废弃的node-sass不建议使用),执行安装命令:
- 完成上述调整后,你现有写的
buildStyles函数无需修改,重新运行gulp任务即可正常将编译后的CSS文件输出到./css目录。 - 可选排查项:如果调整后还是没有输出,可检查两个点:
- 确认
./sass目录下确实存在.scss后缀的文件,路径没有拼写错误 - 运行任务时查看控制台是否有scss语法错误抛出,语法错误也会中断编译输出
- 确认
内容的提问来源于stack exchange,提问作者bob
相关产品推荐
相关产品推荐

