CODEWITHSUNDEEP
angularjsgulp
FalconFlyer
FalconFlyer

Reputation: 155

Gulp does not produce intended Css and Html folder

gulp build command in command prompt creates a folder js and also a file scripts.js in dist folder. But the same does not get created for Css and Html. My css and Html folder have atlest one file and are not empty.

const gulp = require('gulp');
const concat = require('gulp-concat');
const browserSync = require('browser-sync').create();

const scripts = require('./scripts');
const styles = require('./styles');

var devMode = false;



gulp.task('css',function(){
    gulp.src(styles)
        .pipe(concat('main.css'))
        .pipe(gulp.dest('./dist/css'))
        .pipe(browserSync.reload({
            stream : true
    }))
});

gulp.task('js',function(){
    gulp.src(scripts)
        .pipe(concat('scripts.js'))
        .pipe(gulp.dest('./dist/js'))
        .pipe(browserSync.reload({
            stream : true
    }))
});

gulp.task('html',function(){
    gulp.src('./src/templates/**/*.html')
        .pipe(gulp.dest('./dist/html'))
        .pipe(browserSync.reload({
            stream : true
    }))
});

gulp.task('build',function(){
    gulp.start(['css','js','html'])
});

gulp.task('browser-sync',function(){
    browserSync.init(null,{
        open : false,
        server : {
            baseDir : 'dist'
        }
    })
});

gulp.task('start',function(){
    devMode = true;
    gulp.start(['build','browser-sync']);
    gulp.watch(['./src/css/**/*.css'],['css']);
    gulp.watch(['./src/js/**/*.js'],['js']);
    gulp.watch(['./src/templates/**/*.html'],['html']); 
});

Following is the output

The project structure

Upvotes: 1

Views: 102

Answers (1)

32teeths
32teeths

Reputation: 1499

I would suggest you use yeoman with a generator like Fountain so that you dont have to spend your time on building the gulp tasks . Fountain has a very good gulp setup which you could customize according to your need.

While loading the files with gulp.src you need to pass the path to the files , Here you have mentioned only gulp.src(require(./styles)) which I am not sure would work . Instead pass , gulp.src('**/*.css') which would scan through all the folders and take all the .css files.

Upvotes: 1

Related Questions