Sửa đổi tệp tại chỗ (cùng mục đích) bằng cách sử dụng Gulp.js và một hình cầu

Tôi có một nhiệm vụ gulp đang cố gắng chuyển đổi tệp .scss thành tệp .css (sử dụng gulp-ruby-sass) và sau đó đặt tệp .css kết quả vào cùng vị trí đã tìm thấy tệp gốc. Vấn đề là, vì tôi đang sử dụng một hình cầu, tôi không nhất thiết phải biết nơi lưu trữ tệp gốc.

Trong đoạn mã bên dưới, tôi đang cố gắng sử dụng gulp-tap để khai thác luồng và tìm ra đường dẫn tệp của tệp hiện tại mà luồng được đọc từ:

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

Dựa trên đầu ra của console.log(fileLocation), mã này có vẻ như nó sẽ hoạt động tốt. Tuy nhiên, các tệp CSS kết quả dường như được đặt cao hơn một thư mục mà tôi mong đợi. Đúng ra project/sass/partials, đường dẫn tệp kết quả chỉ là project/partials.

Nếu có một cách đơn giản hơn để làm điều này, tôi chắc chắn sẽ đánh giá cao giải pháp đó hơn nữa. Cảm ơn!

Như bạn đã nghi ngờ, bạn đang làm cho điều này quá phức tạp. Điểm đến không cần phải động vì đường dẫn hình cầu cũng được sử dụng cho mục đích này dest. Đơn giản chỉ cần chuyển đến cùng một thư mục cơ sở mà bạn đang hiển thị src từ đó, trong trường hợp này là "sass":

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

Nếu các tệp của bạn không có cơ sở chung và bạn cần chuyển một mảng đường dẫn, thì điều này không còn đủ nữa. Trong trường hợp này, bạn muốn chỉ định tùy chọn cơ sở.

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

Điều này đơn giản hơn số 1311407 đã dẫn trên. Bạn không cần chỉ định thư mục đích, chỉ cần sử dụng .. Ngoài ra, hãy đảm bảo đặt thư mục cơ sở.

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

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

Câu trả lời ban đầu được đưa ra tại đây: https://stackoverflow.com/a/29817916/3834540 .

Tôi biết chủ đề này đã cũ nhưng nó vẫn hiển thị dưới dạng kết quả đầu tiên trên google nên tôi nghĩ tôi cũng có thể đăng liên kết ở đây.

Điều này rất hữu ích!

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