Ojala me entiendan y puedan ayudarme, tengo esa estructura en un proyecto estoy trabajando con Gulp, gulp-sass, browser-Sync; se supone que sass la documentarion dice que se puede crear partials añadiendo el subrayado para que importes pero no se compile en un archivo css aparte entonces eso estoy haciendo, creando un archivo _variables.scss y mi archivo principal es main.scss, todo corre normal hago un cambio y mi navegador se refresca gracias a browser-sync pero pasa algo extraño que si realizo dos o tres cambios seguidos en ese archivo _variables.scss lo q esta compilando normal como se ve en la imagen de consola empieza a salir un error que no halla el archivo importado .. como hago yo quiero importar de esa manera.
var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
// Task BrowserSync
gulp.task('serve',['sass'], function() {
browserSync.init({
server: "./app"
});
gulp.watch('scss/**/*.scss', ['sass']);
gulp.watch('app/*.html').on('change', browserSync.reload);
});
// Task compile sass
gulp.task('sass', function() {
return gulp.src('scss/main.scss')
.pipe(sass())
.pipe(gulp.dest('app/css'))
.pipe(browserSync.stream())
});
includePaths
a la funciónsass
en el gulpfile? Edita tu pregunta y añade el código del gulpfile._variables.scss
ascss/partials
y añade lo siguiente asass
:{ includePaths: ['scss/partials'] }
. Es importante que sigas importando directamentevariables.css
y nopartials/variable.scss
../
eso le dira al script que esta dentro de la misma carpeta, y deberia de quedar asi@import "./variables"