javascript - Use .scss filename to determine gulp's output path -

let's have following directory structure:

project │ ├destination │ ├abc │ │ └style.css │ ├def │ │ └style.css │ └ghi │   └style.css │ ├scss │ ├abc.scss │ ├def.scss │ └ghi.scss │ ├gulpfile.js ... 

is there way, using gulp, accept name of scss file being watched, , use means determine output path? so, when saving ghi.scss, result destination/ghi/style.css?

i've tried using gulp-filenames dependency, experience gulp limited.

my current gulp file follows:

var gulp = require('gulp');  var filenames = require("gulp-filenames"); var sass = require('gulp-sass'); var concat = require('gulp-concat'); var uglify = require('gulp-uglify'); var rename = require('gulp-rename');  gulp.task('sass', function() {     return gulp.src('scss/*.scss')         .pipe(sass())         .pipe(gulp.dest('css')); });  gulp.task('watch', function() {     gulp.watch('scss/*.scss', ['sass']); });  gulp.task('default', ['sass', 'watch']);