Змініть файл на місці (те саме призначення) за допомогою Gulp.js та шаблону глобалізації

У мене є завдання gulp, яке намагається перетворити .scss файли у .css-файли (використовуючи gulp-ruby-sass), а потім розміщую отриманий .css-файл у тому самому місці, де було знайдено оригінальний файл. Проблема полягає в тому, що я використовую шаблон, який не використовується, я не обов'язково знаю, де зберігається оригінальний файл.

У наведеному нижче коді я намагаюся використовувати gulp-tap, щоб натиснути на потік і з'ясувати шлях до поточного файлу, з якого читався потік:

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));
});

На основі виходу console.log(fileLocation)цього коду здається, що він повинен добре працювати. Однак отримані файли CSS здаються на одну директорію вище, ніж я очікував. Там, де він повинен бути project/sass/partials, отриманий шлях до файлу просто справедливий project/partials.

Якщо є набагато простіший спосіб зробити це, я б точно оцінив це рішення ще більше. Дякую!

Як ви підозрювали, ви робите це занадто складно. Місце призначення не повинно бути динамічним, оскільки глобальний шлях також використовується dest. Просто переведіть в той самий базовий каталог, з якого ви глобуєте src, у цьому випадку "sass":

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

Якщо ваші файли не мають загальної бази, і вам потрібно пройти масив шляхів, цього вже недостатньо. У цьому випадку потрібно вказати базовий варіант.

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

Це простіше, ніж привели цифри1311407. Вам зовсім не потрібно вказувати папку призначення, просто використовуйте .. Також обов’язково встановіть базовий каталог.

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

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

Оригінальна відповідь наведена тут: https://stackoverflow.com/a/29817916/3834540 .

Я знаю, що цей потік старий, але він все ще відображається як перший результат у Google, тому я подумав, що міг би також розмістити посилання тут.

Це було дуже корисно!

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(".")); 
    });
})