Gulp - Kezdés ES modullal

• Szerző: Sallai András
• Copyright © 2024, Sallai András
• Licenc: CC BY-SA 4.0
• Web: https://szit.hu

mkdir app01
cd app01
npm init -y

npm install --save-dev browser-sync gulp gulp-minify gulp-clean-css

Ha állományban akarunk szöveget cserélni, és/vagy szöveget összefűzni:

npm install --save-dev gulp-replace gulp-concat

Ha TypeScriptet is használunk:

npm install --save-dev gulp-typescript

gulpfile.js

import {src, dest, parallel} from 'gulp';
import cleanCss from 'gulp-clean-css';
import replace from 'gulp-replace';
import minify from 'gulp-minify';
import concat from 'gulp-concat';
 
import {create as bsCreate} from 'browser-sync';
const browserSync = bsCreate();
 
function genHTML(cb) {
    src('src/**/*.html')
    .pipe(replace(/app.js/g, 'app-min.js'))
    .pipe(dest('public'))
    cb();
}
 
function minifyJS(cb) {
  src([
    'src/**/*.js', 
    'node_modules/bootstrap/dist/js/bootstrap.js'
  ])
    .pipe(replace(/import .*/g, ''))
    .pipe(replace(/export .*/g, ''))
    .pipe(concat('app.js'))
    .pipe(minify())
    .pipe(dest('public'));
  cb();
}
 
function minifyCSS(cb) {
  src([
    'src/**/*.css', 
    'node_modules/bootstrap/dist/css/bootstrap.css'])
    .pipe(cleanCss())
    .pipe(dest('public'));
  cb();
}
 
function build(cb) {
  parallel(genHTML, minifyJS, minifyCSS)(cb);
}
 
export default build

gulpfile.js

import {src, dest, parallel} from 'gulp';
import cleanCss from 'gulp-clean-css';
import replace from 'gulp-replace';
import minify from 'gulp-minify';
import concat from 'gulp-concat';
import ts from 'gulp-typescript';
 
import {create as bsCreate} from 'browser-sync';
const browserSync = bsCreate();
 
function genHTML(cb) {
    src('src/**/*.html')
    .pipe(replace(/app.js/g, 'app-min.js'))
    .pipe(dest('public'))
    cb();
}
 
function minifyJS(cb) {
  src([
    'src/**/*.js', 
    'node_modules/bootstrap/dist/js/bootstrap.js'
  ])
    .pipe(replace(/import .*/g, ''))
    .pipe(replace(/export .*/g, ''))
    .pipe(concat('app.js'))
    .pipe(minify())
    .pipe(dest('public'));
  cb();
}
 
function minifyCSS(cb) {
  src([
    'src/**/*.css', 
    'node_modules/bootstrap/dist/css/bootstrap.css'])
    .pipe(cleanCss())
    .pipe(dest('public'));
  cb();
}
 
function build(cb) {
  parallel(genHTML, minifyJS, minifyCSS)(cb);
}
 
function tsc(cb) {
  src('src/**/*.ts')
    .pipe(ts({
      outFile: 'output.js'
    }))
    .pipe(dest('public'));
    cb();
}
export { tsc }
export default build