How to properly setup gulp/sass

[OvalMedia]

I am familiar with gulp, using it for all my projects (foundation 5 so far).
When I try to setup bones for sass usage it looks unfinished or unprepared for sass. So I wonder where to go from here. For example: each of the sass files in the sccs folder simply include "foundation". Of course that won't work because the foundation files all reside in the bower_components folder. Compilation must fail.

This is my gulpfile in project root:

`'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');
var plumber = require('gulp-plumber');
var uglify = require('gulp-uglify');

var skinDir = './theme/';

var js_src = skinDir + 'js-src//*.js';
var js_dst = skinDir + 'js';
var scss_src = skinDir + 'scss//*.scss';
var scss_dst = skinDir + 'css';

// SASS
gulp.task('sass', function () {
gulp.src(scss_src)
.pipe(plumber())
.pipe(sass({
sourceComments: true,
//outputStyle: 'compressed'
}).on('error', sass.logError))
.pipe(gulp.dest(scss_dst));
});

// JAVASCRIPT
gulp.task('scripts', function () {
gulp.src(js_src)
.pipe(plumber())
.pipe(uglify())
.pipe(gulp.dest(js_dst));
});

gulp.task('watch', function () {
gulp.watch(scss_src, ['sass']);
gulp.watch(js_src, ['scripts']);
});

gulp.task('default', function () {
gulp.start('watch');
});`

The "theme" folder is a softlink from project root to user/themes/bones, in case you are wondering.
Am I missing something?

[OvalMedia]

This is what I did:

I replaced all occurences of...
@import 'foundation';
with...
@import '../bower_components/foundation-sites/scss/foundation';

and in the files ui-animations.scss and ui-trnasitions.scss...
@import 'motion-ui';
with...
@import '../bower_components/motion-ui/motion-ui';

Now the files compile without errors.