【发布时间】:2014-03-04 08:13:03
【问题描述】:
我设置了一个 gulp.js 配置,以便在保存时自动编译我的 SASS 和 CoffeeScript。它可以工作,只是相对路径完全丢失,所有文件都输出到一个平面目录中。我想在编译最终的 CSS 和 JS 文件时保留我的 app/assets/sass 和 app/assets/coffee 目录的子目录结构。这是我的 gulpfile:
var gulp = require('gulp');
var plumber = require('gulp-plumber');
var gutil = require('gulp-util');
var minifycss = require('gulp-minify-css');
var autoprefixer = require('gulp-autoprefixer');
var sass = require('gulp-ruby-sass');
var coffee = require('gulp-coffee');
var sassDir = 'app/assets/sass';
var coffeeDir = 'app/assets/coffee';
gulp.task('sass', function() {
return gulp.src(sassDir + '/**/*.scss')
.pipe(plumber())
.pipe(sass({ style: 'compress' }).on('error', gutil.log))
.pipe(autoprefixer('last 10 versions'))
.pipe(minifycss())
.pipe(gulp.dest('public/css'));
});
gulp.task('coffee', function() {
return gulp.src(coffeeDir + '/**/*.coffee')
.pipe(plumber())
.pipe(coffee({ bare: true }).on('error', gutil.log))
.pipe(gulp.dest('public/js/coffee)'));
});
gulp.task('watch', function() {
gulp.watch(sassDir + '/**/*.scss', ['sass']);
gulp.watch(coffeeDir + '/**/*.coffee', ['coffee']);
});
gulp.task('default', ['sass', 'coffee', 'watch']);
【问题讨论】:
-
当我注释掉 .src 和 .dest 之间的所有管道时,{ base: '...' } 解决方案有效,但添加 sass() 步骤会产生同样的问题。跨度>
-
那么
gulp-sass插件可能正在从源文件中删除或修改relative属性。我不使用那个插件,所以我不确定。您可以使用gulp-debugplugin 查看您的文件发生了什么。
标签: javascript sass gulp