Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- const gulp = require("gulp");
- const sass = require("gulp-sass");
- const browserSync = require("browser-sync").create();
- const imagemin = require("gulp-imagemin");
- const concat = require("gulp-concat");
- const uglify = require("gulp-uglify-es").default;
- // Compile SCSS into CSS
- styles = () => {
- return (
- gulp
- // 1. Where is the SCSS file
- .src("./src/scss/APP.scss")
- // 2. Pass that file through the SASS compiler
- .pipe(sass({ outputStyle: "compressed" }).on("error", sass.logError))
- // 3. Destination for the CSS
- .pipe(gulp.dest("./build"))
- // 4. Stream changes to all browsers
- .pipe(browserSync.stream())
- );
- };
- html = () => {
- return (
- gulp
- // 1. Where is the HTML file
- .src("./src/html/**/*.html")
- // 2. Destination for the CSS
- .pipe(gulp.dest("./build/HTML"))
- // 3. Stream changes to all browsers
- .pipe(browserSync.stream())
- );
- };
- javascript = () => {
- return (
- gulp
- // 1. Where are the JavaScript dependencies located
- .src([
- "./node_modules/jquery/dist/jquery.js",
- "./src/js/**/*.js",
- "./node_modules/bootstrap/dist/js/bootstrap.js"
- ])
- // 2. Bundle and minify the JavaScript
- .pipe(concat("bundle.js"))
- .pipe(uglify())
- // 3. Destination for the Javascript
- .pipe(gulp.dest("./build"))
- // 4. Stream changes to all browsers
- .pipe(browserSync.stream())
- );
- };
- images = () => {
- return (
- gulp
- // 1. Where is the images directory
- .src("./src/assets/**/*")
- // 2. Minify the images
- .pipe(imagemin())
- // 3. Destination for the images
- .pipe(gulp.dest("./build/images"))
- // 4. Stream changes to all browsers
- .pipe(browserSync.stream())
- );
- };
- watch = () => {
- browserSync.init({
- server: {
- baseDir: "./build",
- index: "./HTML/index.html"
- }
- });
- gulp.watch("./src/html/**/*.html", html);
- gulp.watch("./src/scss/**/*.scss", styles);
- gulp.watch("./src/js/**/*.js", javascript);
- gulp.watch("./src/assets/**/*", images);
- gulp.watch("./src/js/**/*js").on("change", browserSync.reload);
- gulp.watch("./src/html/**/*.html").on("change", browserSync.reload);
- gulp.watch("./src/assets/**/*").on("change", browserSync.reload);
- };
- gulp.task("default", gulp.series(html, styles, images, javascript, watch));
- exports.styles = styles;
- exports.watch = watch;
- exports.html = html;
- exports.javascript = javascript;
- exports.images = images;
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement