Импорт SASS не работает с gulp-ruby-sass

Я попытался настроить проект, описанный здесь. Все работает отлично, но импорт SASS не работает.

Основной.scss:

@import
 "partials/0.mixins",
 "partials/1.settings",
 "partials/2.normalize",
 "partials/3.base",
 "partials/4.layout",
 "partials/5.typo",
 "partials/6.states",
 "partials/7.theme",
 "partials/8.print";

Глоток производит следующее main.css:

@import
 "partials/0.mixins",
 "partials/1.settings",
 "partials/2.normalize",
 "partials/3.base",
 "partials/4.layout",
 "partials/5.typo",
 "partials/6.states",
 "partials/7.theme",
 "partials/8.print";

и main.min.css пуст. Я попытался использовать флаг loadPath в моем gulpfile.js без успеха (конфигурация моей задачи:

...
// Styles
gulp.task('styles', function() {
 return gulp.src('src/styles/main.scss')
 .pipe(sass({
 check: true,
 loadPath: 'src/styles',
 style: 'expanded'
 }))
 .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
 .pipe(gulp.dest('dist/styles'))
 .pipe(rename({ suffix: '.min' }))
 .pipe(minifycss())
 .pipe(livereload(server))
 .pipe(gulp.dest('dist/styles'))
 .pipe(notify({ message: 'Styles task complete' }));
});
...

Мои ресурсы взяты из проекта Compass/SASS и с ворчанием.

Какие-либо предложения?

Спасибо & ciao Ralf

2 ответа

Вы передаете опцию check: true, которая, как говорится в документации, сообщает заданию: "Просто проверьте синтаксис, не оценивайте". Попробуйте без check: true.


Спасибо Брайан за подсказку. С gulp-компасом он работает.

Вот мой gulpfile.js:

// Load plugins
var gulp = require('gulp'),
 compass = require('gulp-compass'),
 autoprefixer = require('gulp-autoprefixer'),
 minifycss = require('gulp-minify-css'),
 jshint = require('gulp-jshint'),
 uglify = require('gulp-uglify'),
 imagemin = require('gulp-imagemin'),
 rename = require('gulp-rename'),
 clean = require('gulp-clean'),
 concat = require('gulp-concat'),
 notify = require('gulp-notify'),
 cache = require('gulp-cache'),
 livereload = require('gulp-livereload'),
 lr = require('tiny-lr'),
 server = lr();

// Styles
gulp.task('styles', function() {
 return gulp.src('src/styles/main.scss')
 .pipe(compass({
 sass: 'src/styles',
 css: 'dist/styles'
 }))
 .pipe(autoprefixer('last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
 .pipe(gulp.dest('dist/styles'))
 .pipe(rename({ suffix: '.min' }))
 .pipe(minifycss())
 .pipe(livereload(server))
 .pipe(gulp.dest('dist/styles'))
 .pipe(notify({ message: 'Styles task complete' }));
});

// Scripts
gulp.task('scripts', function() {
 return gulp.src('src/scripts/**/*.js')
 .pipe(jshint('.jshintrc'))
 .pipe(jshint.reporter('default'))
 .pipe(concat('main.js'))
 .pipe(gulp.dest('dist/scripts'))
 .pipe(rename({ suffix: '.min' }))
 .pipe(uglify())
 .pipe(livereload(server))
 .pipe(gulp.dest('dist/scripts'))
 .pipe(notify({ message: 'Scripts task complete' }));
});

// Images
gulp.task('images', function() {
 return gulp.src('src/images/**/*')
 .pipe(cache(imagemin({ optimizationLevel: 3, progressive: true, interlaced: true })))
 .pipe(livereload(server))
 .pipe(gulp.dest('dist/images'))
 .pipe(notify({ message: 'Images task complete' }));
});

// Clean
gulp.task('clean', function() {
 return gulp.src(['dist/styles', 'dist/scripts', 'dist/images'], {read: false})
 .pipe(clean());
});

// Default task
gulp.task('default', ['clean'], function() {
 gulp.start('styles', 'scripts', 'images');
});

// Watch
gulp.task('watch', function() {

 // Listen on port 35729
 server.listen(35729, function (err) {
 if (err) {
 return console.log(err);
 }

 // Watch .scss files
 gulp.watch('src/styles/**/*.scss', ['styles']);

 // Watch .js files
 gulp.watch('src/scripts/**/*.js', ['scripts']);

 // Watch image files
 gulp.watch('src/images/**/*', ['images']);

 });

});

Большое спасибо.

Ciao Ralf

licensed under cc by-sa 3.0 with attribution.