layout : post title : “Gulpfile のひな形” date : 2020-07-11 20:00 categories : [JavaScript] keywords : JavaScript, Gulp excerpt : “毎回調べる時間がもったいないのでシンプルなひな形だけ残しておく。” bg : other —

const { series, parallel, watch, src, dest } = require('gulp');

const sass            = require("gulp-sass");
const packageImporter = require("node-sass-package-importer");
const autoprefixer    = require("gulp-autoprefixer");

const paths  = {
    styles :{
        src  : './src/sass/**/*.scss',
        dest : './dist/css/'
    },
    js : {
        src  : './src/js/**/*.js',
        dest : './dist/js/'
    }
}


function javascript(){
    return src(paths.js.src )
    .pipe(dest(paths.js.dest));
}

function styles(){
    return src(paths.styles.src)
    .pipe(
      sass({
        importer: packageImporter({
          extensions: [".scss", ".css"]
        })
      })
    )
    .pipe(
      autoprefixer({
        cascade: false
      })
    )
    .pipe(dest(paths.styles.dest))
}


function watchFiles(){
    watch(paths.styles.src, styles);
    watch(paths.js.src, javascript);
}

exports.default = series(parallel(styles, javascript), series(watchFiles))