Gulp command does not work

Question

Hello,

I created a home.Ass file

@import molecules/mixins

@import ../bower_components/bootstrap-sass/assets/stylesheets/bootstrap /variables
@import ../bower_components/bootstrap-sass/assets/stylesheets/bootstrap /mixins
@import ../bower_components/breakpoint-sass/stylesheets/breakpoint`

These lines were to import this files to my css folder but when I give the Gulp command, the files are not imported it reads my gulpfile and then nothing appears in the terminal and I always have to close the command by giving Ctrl + C

C:\Users\loja\Desktop\Alacarte>gulp
[15:41:46] Using gulpfile ~\Desktop\Alacarte\gulpfile.js
[15:41:46] Starting 'sass'...
[15:41:46] Starting 'watch'...
[15:41:47] Finished 'watch' after 210 ms
[15:41:48] Finished 'sass' after 1.92 s
[15:41:48] Starting 'default'...
[15:41:48] Finished 'default' after 22 μs 

this is my gulpfile

'use strict';

var gulp = require('gulp');
var sass = require('gulp-sass');
var watch = require('gulp-watch');

gulp.task('default', ['sass', 'watch']);

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

gulp.task('sass', function () {
 return gulp.src('sass/**/*.sass')
    .pipe(sass({outputStyle: 'compressed'}))
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('css'));
});

gulp.task('watch', function () {
gulp.watch('sass/**/*.sass', ['sass']);
});

Can you help me ?

Answer 1

Let’s get some data, your files @import are being called wrong, lack the *extension and missing to circle the url with simple quotation marks.

*I mentioned that the extension is missing because I don’t know how your files are named, if your files are named with _ underline at the beginning of the file name _my-scss.scss It’s okay to call them without the extension.

Way to import url

@import '<nome-da-pasta>/<nome-arquivo><.><extensão-do-arquivo>';

Changing your code to the correct format will look like this

@import 'molecules/mixins.sass';
@import '../bower_components/bootstrap-sass/assets/stylesheets/bootstrap /variables.sass';
@import '../bower_components/bootstrap-sass/assets/stylesheets/bootstrap /mixins.sass;'
@import '../bower_components/breakpoint-sass/stylesheets/breakpoint.sass`;

Already in the archive gulpfile.js you need to confirm the url of the folder you want to monitor.

gulp.watch('sass/**/*.sass',['sass]);

The way to pass the url would thus insert the path from the ./ of the initial directory.

gulp.watch('./sass/**/*.sass',['sass]);