javascript - gulp-sass: how to disable adding of prefixes path of background-image -

hello everyone!

i'm developing web app, , using gulp-sass compile files css.

schematic project structure:

build/   -image.png   -build.css src/   -app/      -component_1/         -component.scss    

inside component.scss:

div.component {   background: url("/image.png") no-repeat center center; } 

here gulp script, responsible compiling sass css:

 gulp.task('sass', function () {   return gulp.src("src/app/**/*.scss")     .pipe(sass().on("error", sass.logerror))     .pipe(gulp.dest("./sass.compiled/"))     .pipe(concatcss("build.css"))     .pipe(gulp.dest("build")); }); 

as result: gulp-scss prepends background's url property path: 'component_1'. instead of expected:

background: url("/image.png") no-repeat center center; 

i get:

background: url("component_1/image.png") no-repeat center center; 

is there way, make gulp-sass prevent such behavior?

it's not gulp-sass causing this, gulp-concat-css. package description states:

concatenates css files, bubbling @import statements (as per standard), , optionally rebasing urls , inlining local @import statements.

you need disable optional url rebasing. can using rebaseurls option:

gulp.task('sass', function () {   return gulp.src("src/app/**/*.scss")     .pipe(sass().on("error", sass.logerror))     .pipe(gulp.dest("./sass.compiled/"))     .pipe(concatcss("build.css", { rebaseurls: false }))     .pipe(gulp.dest("build")); });