Modifier le fichier sur place (même destination) en utilisant Gulp.js et un motif de globbing

J'ai une tâche gulp qui tente de convertir des fichiers .scss en fichiers .css (en utilisant gulp-ruby-sass), puis placez le fichier .css résultant au même endroit où il a trouvé le fichier d'origine. Le problème est que, puisque j'utilise un modèle de globbing, je ne sais pas nécessairement où le fichier d'origine est stocké.

Dans le code ci-dessous, j'essaie d'utiliser gulp-tap pour accéder au flux et déterminer le chemin du fichier du fichier actuel à partir duquel le flux a été lu:

gulp.task('convertSass', function() {
    var fileLocation = "";
    gulp.src("sass/**/*.scss")
        .pipe(sass())
        .pipe(tap(function(file,t){
            fileLocation = path.dirname(file.path);
            console.log(fileLocation);
        }))
        .pipe(gulp.dest(fileLocation));
});

Sur la base de la sortie de console.log(fileLocation), ce code semble fonctionner correctement. Cependant, les fichiers CSS résultants semblent être placés un répertoire plus haut que ce à quoi je m'attendais. Là où il devrait être project/sass/partials, le chemin du fichier résultant est juste project/partials.

S'il existe une manière beaucoup plus simple de faire cela, j'apprécierais certainement encore plus cette solution. Merci!

Comme vous vous en doutez, vous rendez cela trop compliqué. La destination n'a pas besoin d'être dynamique car le chemin global est également utilisé pour le dest. Dirigez-vous simplement vers le même répertoire de base à partir duquel vous effectuez le glissement du src, dans ce cas "sass":

gulp.src("sass/**/*.scss")
  .pipe(sass())
  .pipe(gulp.dest("sass"));

Si vos fichiers n'ont pas de base commune et que vous devez passer un tableau de chemins, ce n'est plus suffisant. Dans ce cas, vous voudrez spécifier l'option de base.

var paths = [
  "sass/**/*.scss", 
  "vendor/sass/**/*.scss"
];
gulp.src(paths, {base: "./"})
  .pipe(sass())
  .pipe(gulp.dest("./"));

C'est plus simple que les nombres1311407. Vous n'avez pas du tout besoin de spécifier le dossier de destination, utilisez simplement .. Assurez-vous également de définir le répertoire de base.

gulp.src("sass/**/*.scss", { base: "./" })
    .pipe(sass())
    .pipe(gulp.dest("."));

gulp.src("sass/**/*.scss")
  .pipe(sass())
  .pipe(gulp.dest(function(file) {
    return file.base;
  }));

Réponse à l'origine donnée ici: https://stackoverflow.com/a/29817916/3834540 .

Je sais que ce fil est vieux, mais il apparaît toujours comme le premier résultat sur Google, alors j'ai pensé que je pourrais aussi bien publier le lien ici.

Cela a été très utile!

gulp.task("default", function(){

    //sass
    gulp.watch([srcPath + '.scss', '!'+ srcPath +'min.scss']).on("change", function(file) {
         console.log("Compiling SASS File: " + file.path)
         return gulp.src(file.path, { base: "./" })
        .pipe(sass({style: 'compressed'}))
        .pipe(rename({suffix: '.min'}))
        .pipe(sourcemaps.init())
        .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
        }))
        .pipe(sourcemaps.write('./'))         
        .pipe(gulp.dest(".")); 
    });

    //scripts
    gulp.watch([srcPath + '.js','!'+ srcPath + 'min.js']).on("change", function(file) {
        console.log("Compiling JS File: " + file.path)
        gulp.src(file.path, { base: "./" })
        .pipe(uglify())
        .pipe(rename({suffix: '.min'}))       
        .pipe(gulp.dest(".")); 
    });
})