我的Gruntfile配置是:
compass: {
options: {
sassDir: '<%= yeoman.app %>/styles',
cssDir: '.tmp/styles',
// generatedImagesDir: '.tmp/images/generated',
imagesDir: '<%= yeoman.app %>/images',
// javascriptsDir: '<%= yeoman.app %>/scripts',
// fontsDir: '<%= yeoman.app %>/styles/fonts',
// importPath: '<%= yeoman.app %>/styles',
// httpImagesPath: '/images',
// httpGeneratedImagesPath: '/images/generated',
// httpFontsPath: '/styles/fonts',
// relativeAssets: false,
// assetCacheBuster: false,
// raw: 'Sass::Script::Number.precision = 10\n'
},
dist: {
options: {
generatedImagesDir: '<%= yeoman.dist %>/images/generated'
}
},
server: {
options: {
debugInfo: true
}
}
}
我的SCSS文件是:
@import "compass/css3";
.toolbar {
@include box-shadow(#555 0px 0px 5px 0px);
@include background-image(linear-gradient(top, #666666, #333333));
}
生成的CSS文件是:
.toolbar {
box-shadow: #555555 0px 0px 5px 0px;
background-image: linear-gradient(top, #666666, #333333);
}
多个浏览器支持丢失了......
但是,奇怪的是当我按compass create xxx
构建项目并复制上面的SCSS,然后运行compass compile xxx
时,一切正常!
为什么呢? grunt-contrib-compass有什么问题吗?