Conclusion:
When using Gulp-compass, you need to specify relative:false , absolute positioning (such as the Http_images_path parameter) to be valid, code:
function () { gulp.src (' sass/{,*/}*.scss ') . Pipe (Compass ({ './config.rb ', ' ... /css.release/touch ', ' sass ', relative:false }). Pipe (Reload ({ true})); });
Story foreground:
Previously used in the project is Grunt construction projects, but in the compass + bowser-sync combined use, the speed is too slow to reach 2.0+s, so the camp to gulp.
When you swap gulp, the test regenerates the CSS file, but the icon for the interface is not visible, and the image shows relative positioning when viewing the source file. It looks like this:
. Icon-clock { background: url ('.. /.. /index.png ') No-repeat;}
The image address is not correct, so it is not displayed.
This is not what I want, I want it this way:
. Icon-clock { background: url (' http://www.sucool.com/index.png ') no-repeat;}
The source code uses Compass's Img-url, so that I can change the location of the image, such as changing the domain name AH what:
. Icon-clock { background: image-url (' index.png ') no-repeat;}
Thinking History:
1. I have specified the config.rb file, thehttp_images_path parameter;
2. Setting the Relative_assets=falseis still not useful;
3. Again in the Gulp configuration, add the relevant parameters relative , OK.
End: In Grunt-compass, as long as the http-images-path parameter is specified in the config.rb file, the image address in the generated CSS will be absolutely positioned, but want to gulp-compass need this.
When using Gulp-compass, the specified relative_assets is invalid