Cacher is the code snippet organizer for pro developers

//========== Gulp ===============//
const {src,dest,parallel,task,watch}=require('gulp');
const concat    =require('gulp-concat'), //concatenar js
    uglify      =require('gulp-uglify'), //minificar js
    browserSync =require('browser-sync').create(), //browser sync
    reload      =browserSync.reload,//reload
    plumber     =require('gulp-plumber'), //errores
    sass        =require('gulp-sass'),
    postcss     =require('gulp-postcss'),//post CSS
    cssnano     =require('cssnano'),
    buffer      =require('vinyl-buffer'),
    sourcemaps  =require('gulp-sourcemaps'),
    autoprefixer=require('autoprefixer'), //autoprefixer
    csso        =require('gulp-csso'), //minificar CSS
    notify      =require('gulp-notify'), //notificaciones
    htmlInjector=require("bs-html-injector"),
    tsify       =require("tsify"),
    browserify  =require("browserify"),
    source      =require("vinyl-source-stream");

//===== configuraciones ===========//

//================================//
const localUrl='http://127.0.0.1:5000';

//sources
const sources={
    php: 'www/**/*.php',
    sass:'./app/sass/**/*.scss',
    css: ['www/css/lib/**/*.css','www/css/lib/**/*.min.css'],
    js:  ['app/scripts/libs/**/*.js'],
};

//destinos
var destination={
    php:     'www/',
    css:     'www/css/',
    sass:    'www/css',
    js:      'www/js/',
    js_admin:'www/js/',
};

//errores
var onError=function (err) {
    console.log('--------------> Error --------->');
    console.log(err);
    console.log('--------------> Error --------->');
};

function task_sass() {
    return src(sources.sass)
        .pipe(sourcemaps.init())
        .pipe(sass().on('error',sass.logError))
        .pipe(postcss(plugins))
        .pipe(csso())
        .pipe(sourcemaps.write())
        .pipe(dest(destination.sass))
        .pipe(notify('SASS complete'))
        .pipe(reload({stream:true}));
}

var plugins=[
    autoprefixer(),
    cssnano({zindex:false})
];

//acciones css
function task_cssmin() {
    return src(sources.css)
        .pipe(plumber())
        .pipe(concat('styles.min.css'))
        .pipe(postcss(plugins))
        .pipe(notify('CSS minificado'))
        .pipe(dest('www/css'))
        .pipe(reload({stream:true}));
}

const config={
    ts:{
        appTs:    './app/scripts/app.ts',
        appTsName:'main.js',
        destTs:   './www/js'
    }
};

function task_ts() {
    return browserify({
        basedir:     '.',
        debug:       true,
        entries:     [config.ts.appTs],
        cache:       {},
        packageCache:{}
    })
        .plugin(tsify)
        .bundle()
        .on('error', function (error) { console.error(error.toString()); })
        //.pipe(plumber())
        .pipe(source(config.ts.appTsName))
        .pipe(buffer())
        .pipe(sourcemaps.init({loadMaps:true}))
        .pipe(uglify())
        .pipe(sourcemaps.write('./'))
        .pipe(notify('Typescript Complete'))
        .pipe(dest(config.ts.destTs))
        .pipe(reload({stream:true}));
}


//Main js del sitio
function task_main_js() {
    return browserify({
        entries:'./app/scripts/app_panel.js',
        debug:  true
    }).transform("babelify",{
        presets:   ["es2015"],
        sourceMaps:false
    }).bundle()
        .pipe(plumber())
        .pipe(source('main.min.js'))
        .pipe(buffer())
        .pipe(sourcemaps.init({loadMaps:true}))
        .pipe(uglify())
        .pipe(sourcemaps.write('.'))
        .pipe(dest(destination.js))
        .pipe(reload({stream:true}));
}

function task_files() {
    return src('./**/*.{php,html,py}')
        .pipe(reload({stream:true}))
}

//browser sync
function task_browsersync() {
    browserSync.use(htmlInjector,{
        files:["./views/**/*.html","./views/**/*.twig"]
    });
    browserSync.init({
        proxy:localUrl,
        open: 'external',
    });
}

//mirar la carpetas
function task_watch() {
    //files
    watch('./**/*.{gif,jpg,png,svg,twig,py}',parallel(task_files));
    //Sass
    watch(sources.sass,parallel(task_sass));
    //CSS
    watch(sources.css,parallel(task_cssmin));
    //js main front-page
    watch('app/scripts/**/*.ts',parallel(task_ts));
}

task('default',parallel(task_watch,task_browsersync));

{
  "devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/preset-env": "^7.9.0",
    "autoprefixer": "^9.7.5",
    "babel-core": "6.26.3",
    "babel-preset-es2015": "6.24.1",
    "babelify": "8.0.0",
    "browser-sync": "^2.26.14",
    "browserify": "^16.5.1",
    "bs-html-injector": "^3.0.3",
    "cssnano": "^5.0.2",
    "gulp": "^4.0.2",
    "gulp-cache": "^1.1.3",
    "gulp-concat": "*",
    "gulp-csso": "*",
    "gulp-notify": "*",
    "gulp-plumber": "*",
    "gulp-postcss": "*",
    "gulp-sourcemaps": "*",
    "gulp-uglify": "^3.0.2",
    "vinyl-buffer": "*",
    "vinyl-source-stream": "*"
  }
}