const { src, dest, watch } = require("gulp");
const sass = require("gulp-sass")(require("sass"));
const browserify = require("browserify");
const babelify = require("babelify");
const source = require("vinyl-source-stream");

function style() {
    return src("src/style/main.scss")
        .pipe(
            sass({
                outputStyle: "compressed",
            }).on("error", sass.logError)
        )
        .pipe(dest("dist"));
    // chamar o caminho do arquivo, conectar com o pipe, chama o gulp, e chama o dest para os arquivos finais
}

function scripts() {
    //bundle: fazer a conversão do arquivo
    return browserify("src/scripts/main.js")
        .transform(babelify.configure({ presets: ["@babel/preset-env"] }))
        .bundle()
        .pipe(source("bundle.js"))
        .pipe(dest("dist"));
}

//Para fazer tudo automaticamente
function sentinel() {
    //quais arquivos serão observados (), um objeto com algumas confifurações e depois a função que será executada
    watch(
        "src/style/**/*.scss",
        {
            ignoreInitial: false,
        },
        style
    );
    watch(
        "src/scripts/**/*.js",
        {
            ignoreInitial: false,
        },
        scripts
    );
}

exports.sentinel = sentinel;