Web applications 将SCS/SASS编译成单独的文件

我正在使用，在构建时遇到了一个问题

---

我目前有一个SASS/SCSS项目。现在，它们都被编译成main.css文件，但是我的客户机希望所有的.scss文件都被编译成单独的.css文件。我看到.scss文件编译成.tmp文件夹中的.css文件，但是当我构建项目时，它们不会转移到DIST文件夹中的styles文件夹。你知道我如何更改“吞咽”设置来执行此操作吗？基本上将所有.scss文件转换为.css文件，并在我在命令行中执行“gulp”时将其包含在构建中？

一种方法是：

删除自定义CSS文件中

周围的注释块

将此添加到

html

任务中（在

return

语句之前）：

从

.scss

文件（

\u base.scss

→ <代码>基本.scss）

@import

将变量、函数等单独导入到每个文件中（当您想使用它们时），它们不再共享，因为partials不会

@import

导入到

main.css

为每个样式表添加一个

---

您是否尝试过指定通配符css输出“*.css”

例如：

var gulp = require('gulp');
var sass = require('gulp-sass');
var minify = require('gulp-minify-css');

gulp.task('scss', function(){
 gulp.src('.tmp/styles/*.scss')
  .pipe(plumber())
  .pipe(sass())
  .pipe(minify(*.css))
  .pipe(gulp.dest('dist/styles/*.css');
});

var gulp = require('gulp');
var sass = require('gulp-sass');
var minify = require('gulp-minify-css');

gulp.task('scss', function(){
 gulp.src('.tmp/styles/*.scss')
  .pipe(plumber())
  .pipe(sass())
  .pipe(minify(*.css))
  .pipe(gulp.dest('dist/styles/*.css');
});