diff --git a/_build/deploy.sh b/_build/deploy.sh index ff84b9a8..ee13fc56 100755 --- a/_build/deploy.sh +++ b/_build/deploy.sh @@ -114,6 +114,12 @@ else fi fi +if pgrep gulp >/dev/null 2>&1 +then + echo "Rebuilding gulp dev assets" + npx gulp restart +fi + if [ -f ".env" ]; then unset $(grep -v '^#' .env | sed -E 's/(.*)=.*/\1/' | xargs) fi diff --git a/gulpfile.mjs b/gulpfile.mjs index 4a9c6d24..ab58200c 100644 --- a/gulpfile.mjs +++ b/gulpfile.mjs @@ -1,28 +1,28 @@ -'use strict'; +"use strict"; // load gulp and gulp plugins -import gulp from 'gulp'; -import plugins from 'gulp-load-plugins'; -import dartSass from 'sass'; -import gulpSass from 'gulp-sass'; -import gulpEsbuild from 'gulp-esbuild'; -import path from 'path'; -import revAll from 'gulp-rev-all'; -import { globalExternals } from '@fal-works/esbuild-plugin-global-externals'; -import { readFile } from 'fs/promises'; +import gulp from "gulp"; +import plugins from "gulp-load-plugins"; +import dartSass from "sass"; +import gulpSass from "gulp-sass"; +import gulpEsbuild from "gulp-esbuild"; +import path from "path"; +import revAll from "gulp-rev-all"; +import { globalExternals } from "@fal-works/esbuild-plugin-global-externals"; +import { readFile } from "fs/promises"; const sass = gulpSass(dartSass); const $ = plugins({ - config: path.join(process.cwd(), 'package.json'), + config: path.join(process.cwd(), "package.json"), }); // load node modules -import { deleteSync } from 'del'; -import pump from 'pump'; -import beeper from 'beeper'; +import { deleteSync } from "del"; +import pump from "pump"; +import beeper from "beeper"; // others -import browserSync from 'browser-sync'; +import browserSync from "browser-sync"; const server = browserSync.create(); // // Gulp config @@ -33,7 +33,7 @@ const server = browserSync.create(); let localConfig; try { - const data = await readFile('./gulpconfig.json'); + const data = await readFile("./gulpconfig.json"); localConfig = JSON.parse(data); } catch (err) { localConfig = { @@ -41,9 +41,9 @@ try { debug: false, }, bs: { - proxy: 'http://localhost:8000', - logLevel: 'info', - tunnel: '', + proxy: "http://localhost:8000", + logLevel: "info", + tunnel: "", open: true, notify: false, }, @@ -52,29 +52,29 @@ try { // Build themeDir variable based on current theme from config file, fallback to default -const themeRoot = 'wp-content/themes/'; -const theme = localConfig.activeTheme || 'timber'; +const themeRoot = "wp-content/themes/"; +const theme = localConfig.activeTheme || "timber"; const themeDir = themeRoot + theme; // Defaults const config = { theme: themeDir, - assets: themeDir + '/assets', - dist: themeDir + '/dist', - dev: themeDir + '/dev', - output: themeDir + '/dev', // default to dev - static: themeDir + '/static', - init: './_init', + assets: themeDir + "/assets", + dist: themeDir + "/dist", + dev: themeDir + "/dev", + output: themeDir + "/dev", // default to dev + static: themeDir + "/static", + init: "./_init", }; // Esbuild project customizations const esbuildConfig = { - path: 'js', - exclude: ['!**/assets/vendor/**', '!**/assets/js/lib/**'], - include: [config.assets + '/{js}/calc/*'], + path: "js", + exclude: ["!**/assets/vendor/**", "!**/assets/js/lib/**"], + include: [config.assets + "/{js}/calc/*"], globals: { - jquery: '$', + jquery: "$", }, }; @@ -98,13 +98,13 @@ const handleErrors = (err) => { // notifications if (err.line && err.column) { - var notifyMessage = 'LINE ' + err.line + ':' + err.column + ' -- '; + var notifyMessage = "LINE " + err.line + ":" + err.column + " -- "; } else { - var notifyMessage = ''; + var notifyMessage = ""; } $.notify({ - title: 'FAIL: ' + err.plugin, + title: "FAIL: " + err.plugin, message: notifyMessage + err.message, }); @@ -122,18 +122,18 @@ const handleErrors = (err) => { const styles = (done) => { const sassOptions = { - outputStyle: 'expanded', + outputStyle: "expanded", }; pump( [ - gulp.src(config.assets + '/scss/*.scss', { + gulp.src(config.assets + "/scss/*.scss", { sourcemaps: !isProduction, }), sass(sassOptions), - $.if(isProduction, $.autoprefixer('last 2 versions')), + $.if(isProduction, $.autoprefixer("last 2 versions")), $.if(isProduction, $.csso()), - gulp.dest(config.output + '/css', { sourcemaps: !isProduction }), + gulp.dest(config.output + "/css", { sourcemaps: !isProduction }), server.stream(), ], (err) => { @@ -161,41 +161,41 @@ const scripts = (done) => { }); const renameOptions = (path) => { - path.dirname = 'js'; + path.dirname = "js"; }; - const filterExclusions = $.filter(['**', ...esbuildConfig.exclude], { + const filterExclusions = $.filter(["**", ...esbuildConfig.exclude], { restore: true, }); pump( [ - gulp.src(config.theme + '/views/layout.twig'), + gulp.src(config.theme + "/views/layout.twig"), assets, - $.filter(['**', '!**/layout.twig'], { restore: true }), + $.filter(["**", "!**/layout.twig"], { restore: true }), $.if(esbuildConfig.include.length > 0, gulp.src(esbuildConfig.include)), $.debug({ - title: 'scripts debug pre filter exclusions: ', + title: "scripts debug pre filter exclusions: ", showFiles: localConfig.gulp.debug, }), filterExclusions, - $.debug({ title: 'scripts debug: ', showFiles: localConfig.gulp.debug }), // to debug files getting proccessed + $.debug({ title: "scripts debug: ", showFiles: localConfig.gulp.debug }), // to debug files getting proccessed gulpEsbuild({ - outdir: '', - sourcemap: isProduction ? false : 'inline', + outdir: "", + sourcemap: isProduction ? false : "inline", bundle: true, loader: { - '.tsx': 'tsx', - '.jsx': 'jsx', - '.js': 'jsx', + ".tsx": "tsx", + ".jsx": "jsx", + ".js": "jsx", }, - target: 'es2015', + target: "es2015", plugins: [globalExternals(esbuildConfig.globals)], }), filterExclusions.restore, $.rename(renameOptions), $.debug({ - title: 'scripts debug after restore and rename: ', + title: "scripts debug after restore and rename: ", showFiles: localConfig.gulp.debug, }), gulp.dest(config.output, {}), @@ -213,7 +213,7 @@ const scripts = (done) => { // When scripts runs, it creates extra files in copying from vendor we can delete const cleanScripts = (done) => { - deleteSync([config.output + '/wp-content']); + deleteSync([config.output + "/wp-content"]); done(); }; @@ -221,7 +221,7 @@ const cleanScripts = (done) => { const copy = (done) => { pump( [ - gulp.src(config.assets + '/{img,fonts,js}/**/*', { + gulp.src(config.assets + "/{img,fonts,js}/**/*", { base: config.assets, }), $.newer(config.output), @@ -234,24 +234,27 @@ const copy = (done) => { // loops through the generated html and replaces all references to static versions const rev = (done) => { let extensions = [ - '.html', - '.css', - '.js', - '.png', - '.jpg', - '.jpeg', - '.gif', - '.svg', - '.woff', - '.woff2', - '.ttf', - '.eot', - '.otf', + ".html", + ".css", + ".js", + ".png", + ".jpg", + ".jpeg", + ".gif", + ".svg", + ".woff", + ".woff2", + ".ttf", + ".eot", + ".otf", ]; pump( [ - gulp.src(config.dist + '/{css,js,fonts,img}/**/*'), - revAll.revision({ dontSearchFile: ['.js'], includeFilesInManifest: extensions }), + gulp.src(config.dist + "/{css,js,fonts,img}/**/*"), + revAll.revision({ + dontSearchFile: [".js"], + includeFilesInManifest: extensions, + }), gulp.dest(config.static), revAll.manifestFile(), gulp.dest(config.static), @@ -279,13 +282,13 @@ const serve = (done) => { notify: localConfig.bs.notify || false, open: localConfig.bs.open || true, tunnel: localConfig.bs.tunnel || false, - logLevel: localConfig.bs.logLevel || 'info', + logLevel: localConfig.bs.logLevel || "info", }); - gulp.watch(config.theme + '/**/*.{twig,php}', gulp.series(reload)); - gulp.watch(config.assets + '/scss/**/*.scss', styles); - gulp.watch(config.assets + '/js/**/*.js', gulp.series(scripts, copy, reload)); - gulp.watch(config.assets + '/{img,fonts}/**', gulp.series(copy, reload)); + gulp.watch(config.theme + "/**/*.{twig,php}", gulp.series(reload)); + gulp.watch(config.assets + "/scss/**/*.scss", styles); + gulp.watch(config.assets + "/js/**/*.js", gulp.series(scripts, copy, reload)); + gulp.watch(config.assets + "/{img,fonts}/**", gulp.series(copy, reload)); done(); }; @@ -304,6 +307,7 @@ export const release = (done) => { }; const compile = gulp.series(clean, styles, scripts, copy, cleanScripts, rev); +export const restart = gulp.series(clean, styles, scripts, copy, reload); export const defaultTasks = gulp.series(clean, styles, scripts, copy, serve); export default defaultTasks;