+ This card uses a custom BEM component for its core styles, but leverages + Bootstrap's `border`, `shadow`, `mb-4`, `p-3`, `text-muted`, and `small` + utilities for modifications. +
+Your custom content here.
+{% endblock %} +``` + +### `{% block footer %}` + +Footer component. + +```njk +{% block footer %} + +{% endblock %} +``` + +### `{% block js %}` + +JavaScript files. Use `{{ super() }}` to keep default scripts. + +```njk +{% block js %} + {{ super() }} + +{% endblock %} +``` + +### `{% block scripts %}` + +Inline JavaScript. + +```njk +{% block scripts %} + +{% endblock %} +``` + +## Usage Examples + +### Hide a component + +```njk +{% block hero %} +{% endblock %} +``` + +### Keep default content and add your own + +```njk +{% block css %} + {{ super() }} + +{% endblock %} +``` + +### Fully override a component + +```njk +{% block header %} +{{ page.description }}
+{% endblock %} +``` + +## Data in Templates + +* `site` — global config from [`src/config/site.js`](../src/config/site.js) +* `page` — all frontmatter fields from the current Markdown file +* Direct variables — top-level frontmatter fields (e.g. `title`, `hero`) + +See [Template Data Reference](./TEMPLATE-DATA.md) for details and examples. + +## Components + +Reusable Nunjucks components are stored in +[`src/lib/components/`](../src/lib/components/). Include them in templates for +modular design. See [Components documentation](./COMPONENTS.md) for usage and +best practices. + +## Custom Nunjucks Filters + +Custom filters are defined in +[`gulp/utils/nunjucks-filters.js`](../gulp/utils/nunjucks-filters.js): + +* `md` — render Markdown to HTML +* `dump` — pretty-print objects +* `safe` — mark as safe HTML + +See [Template Data Reference](./TEMPLATE-DATA.md) for usage. + +## Template Blocks + +You can override any block from the base layout. See +[Nunjucks Blocks Documentation](./NUNJUCKS-BLOCKS.md) for a full list and usage +examples. diff --git a/docs/TEMPLATE-DATA.md b/docs/TEMPLATE-DATA.md new file mode 100644 index 0000000..77f6f43 --- /dev/null +++ b/docs/TEMPLATE-DATA.md @@ -0,0 +1,76 @@ +# Template Data Reference + +This project separates data into **site** (global) and **page** (per-page) +objects for Nunjucks templates. + +## Data Sources & Structure + +* **Site data**: Global config from + [`/src/config/site.js`](../src/config/site.js) + * Example structure: + ```js + export const siteDefaults = { + title: 'Gulp DevStack', + description: 'Modern frontend development workflow with Gulp', + meta: { lang: 'en', charset: 'utf-8' }, + seo: { + /* ... */ + }, + } + ``` +* **Page data**: Frontmatter in Markdown files under + [`/src/routes/`](../src/routes/) (or `/content/pages/`) + * Example frontmatter: + ```md + --- + title: Home + description: Welcome! + menu_main: + name: Home + order: 1 + show: true + hero: + title: ... + description: ... + content: ... + --- + ``` + +## Data Access in Templates + +* **`site`**: Global config, always available + * `{{ site.title }}` + * `{{ site.menu }}` + * `{{ site.meta.lang }}` +* **`page`**: All frontmatter fields for the current page + * `{{ page.title }}` + * `{{ page.hero.title }}` + * `{{ page.features.items }}` +* **Direct variables**: Top-level frontmatter fields are also available directly + * `{{ title }}` + * `{{ hero.title }}` + +*** + +## Custom Nunjucks Filters + +Custom filters are defined in +[`gulp/utils/nunjucks-filters.js`](../gulp/utils/nunjucks-filters.js): + +* `md` — Render Markdown to HTML +* `dump` — Pretty-print objects for debugging +* `safe` — Mark string as safe HTML +* (See the file for more filters) + +Usage example: + +```nunjucks +{{ page.content | md | safe }} +{{ page | dump(2) }}
+```
+
+***
+
+## Common Patterns
+
+For more, see the [Nunjucks blocks documentation](./NUNJUCKS-BLOCKS.md).
diff --git a/eslint.config.js b/eslint.config.js
new file mode 100644
index 0000000..cdd01a5
--- /dev/null
+++ b/eslint.config.js
@@ -0,0 +1,80 @@
+import { FlatCompat } from '@eslint/eslintrc'
+import prettier from 'eslint-config-prettier'
+import globals from 'globals'
+
+const compat = new FlatCompat()
+
+export default [
+ prettier,
+ ...compat.config({
+ plugins: ['jsdoc', 'regexp'],
+ extends: ['plugin:jsdoc/recommended', 'plugin:regexp/recommended'],
+ }),
+
+ // Node.js files (root, gulp, config files)
+ {
+ files: [
+ 'gulpfile*.js',
+ 'gulp/**/*.js',
+ '*.config.js',
+ '.eslintrc.js',
+ 'babel.config.js',
+ ],
+ languageOptions: {
+ ecmaVersion: 2024,
+ sourceType: 'module',
+ globals: {
+ ...globals.node,
+ ...globals.es2024,
+ },
+ },
+ plugins: {},
+ rules: {
+ 'jsdoc/require-jsdoc': 'warn',
+ 'no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
+ 'no-console': 'off',
+ },
+ },
+
+ // Browser files (src directory)
+ {
+ files: ['src/**/*.js'],
+ languageOptions: {
+ ecmaVersion: 2024,
+ sourceType: 'module',
+ globals: {
+ ...globals.browser,
+ ...globals.es2024,
+ },
+ },
+ rules: {
+ 'jsdoc/require-jsdoc': 'warn',
+ 'no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
+ 'no-console': 'warn',
+ },
+ },
+
+ // Test files
+ {
+ files: ['**/*.test.js'],
+ languageOptions: {
+ globals: {
+ ...globals.node,
+ describe: 'readonly',
+ it: 'readonly',
+ before: 'readonly',
+ after: 'readonly',
+ beforeEach: 'readonly',
+ afterEach: 'readonly',
+ },
+ },
+ rules: {
+ 'jsdoc/require-jsdoc': 'off',
+ 'no-console': 'off',
+ },
+ },
+
+ {
+ ignores: ['node_modules/', 'build*/', '.temp/', 'dist/', 'static/'],
+ },
+]
diff --git a/gulp-dev-stack.code-workspace b/gulp-dev-stack.code-workspace
index 13140eb..85da94f 100644
--- a/gulp-dev-stack.code-workspace
+++ b/gulp-dev-stack.code-workspace
@@ -1,18 +1,18 @@
{
"folders": [
{
- "path": "."
- }
+ "path": ".",
+ },
],
"settings": {
"files.autoSave": "onFocusChange",
"files.insertFinalNewline": true,
"files.exclude": {
"**/node_modules": true,
- "temp": true
+ "temp": false,
},
"css.remoteStyleSheets": [
- "https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css"
+ "https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css",
],
"attrsSorter.order": [
"v-.*",
@@ -75,8 +75,28 @@
"bgcolor",
"background",
"data-.*",
- "aria-.*"
- ]
+ "aria-.*",
+ ],
+ "workbench.colorCustomizations": {
+ "activityBar.activeBackground": "#123364",
+ "activityBar.background": "#123364",
+ "activityBar.foreground": "#e7e7e7",
+ "activityBar.inactiveForeground": "#e7e7e799",
+ "activityBarBadge.background": "#bd2260",
+ "activityBarBadge.foreground": "#e7e7e7",
+ "commandCenter.border": "#e7e7e799",
+ "sash.hoverBorder": "#123364",
+ "statusBar.background": "#0a1d39",
+ "statusBar.foreground": "#e7e7e7",
+ "statusBarItem.hoverBackground": "#123364",
+ "statusBarItem.remoteBackground": "#0a1d39",
+ "statusBarItem.remoteForeground": "#e7e7e7",
+ "titleBar.activeBackground": "#0a1d39",
+ "titleBar.activeForeground": "#e7e7e7",
+ "titleBar.inactiveBackground": "#0a1d3999",
+ "titleBar.inactiveForeground": "#e7e7e799",
+ },
+ "peacock.color": "#0a1d39",
},
"extensions": {
"recommendations": [
@@ -88,7 +108,7 @@
"redhat.vscode-yaml",
"yzhang.markdown-all-in-one",
"dbaeumer.vscode-eslint",
- "esbenp.prettier-vscode"
- ]
- }
+ "esbenp.prettier-vscode",
+ ],
+ },
}
diff --git a/gulp-tasks-build/gulp-compile-sass.js b/gulp-tasks-build/gulp-compile-sass.js
deleted file mode 100644
index e979b6c..0000000
--- a/gulp-tasks-build/gulp-compile-sass.js
+++ /dev/null
@@ -1,45 +0,0 @@
-const gulp = require('gulp');
-const gulpConcat = require('gulp-concat');
-const gulpEmptyPipe = require('gulp-empty-pipe');
-const plumber = require('gulp-plumber');
-const postcss = require('gulp-postcss');
-const postcssSyntax = require('postcss-scss');
-const replace = require('gulp-replace');
-const sass = require('gulp-sass')(require('sass'));
-const sassGlob = require('gulp-sass-glob');
-
-/**
- * @description Compiling SCSS files into CSS files
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} outputConcatFileName Output file name
- * @param {object} postcssPluginsBase Postcss plugins
- * @returns {*} Compiled file
- */
-
-const compileSass = (
- input,
- output,
- outputConcatFileName,
- postcssPluginsBase,
- params = {}
-) => {
- const processFile = outputConcatFileName ? gulpConcat : gulpEmptyPipe;
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(sassGlob())
- .pipe(sass())
- .on('error', sass.logError)
- .pipe(replace(/\/\*!/g, '/*'))
- .pipe(replace('@charset "UTF-8";', ''))
- .pipe(postcss(postcssPluginsBase, { syntax: postcssSyntax }))
- .pipe(processFile(outputConcatFileName))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = compileSass;
diff --git a/gulp-tasks-build/gulp-html-build.js b/gulp-tasks-build/gulp-html-build.js
deleted file mode 100644
index 6a636bf..0000000
--- a/gulp-tasks-build/gulp-html-build.js
+++ /dev/null
@@ -1,212 +0,0 @@
-const data = require('gulp-data');
-const dateFilter = require('nunjucks-date-filter-locale');
-const fs = require('fs');
-const gulp = require('gulp');
-const gulpif = require('gulp-if');
-const inject = require('gulp-inject');
-const log = require('fancy-log');
-const markdown = require('nunjucks-markdown-filter');
-const minify = require('gulp-htmlmin');
-const nunjucksRender = require('gulp-nunjucks-render');
-const plumber = require('gulp-plumber');
-const rename = require('gulp-rename');
-const replace = require('gulp-replace');
-require('dotenv').config();
-
-/**
- * @description Compile Nunjucks templates and replaces variable from JSON
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} dataSource Input file/path with data structure
- * @param {string} rename Custom name of file
- * @param {string} injectCss Path to css files which you want inject
- * @param {Array} injectJs Path to JS files which you want inject
- * @param {Array} injectCdnJs Path to CDN JS files which you want inject
- * @returns {*} Compiled file
- */
-
-const buildHtml = (params) => {
- // eslint-disable-next-line global-require, import/no-dynamic-require
- const localeSettings = require(`.${params.siteConfig}`);
- const renameCondition = !!params.rename;
- dateFilter.setLocale(localeSettings.meta.lang);
- let currentFile = '';
- let existsJson = false;
- let findJson = true;
- let oldDataSource = '';
-
- if (params.dataSource.includes('.json')) {
- if (typeof params.dataSource !== 'object') {
- params.dataSource = [params.dataSource];
- }
-
- params.dataSource.forEach((element) => {
- try {
- fs.accessSync(element);
- existsJson = true;
- findJson = false;
- } catch (error) {
- log.error(`buildHtml(): JSON file ${element} doesn't exists.`);
- existsJson = false;
- findJson = false;
- }
- });
- }
-
- nunjucksRender.nunjucks.configure(params.templates, {
- watch: false,
- lstripBlocks: true,
- throwOnUndefined: true,
- trimBlocks: true,
- stream: true,
- });
-
- return (
- gulp
- .src(params.input)
- .pipe(plumber())
- .pipe(
- rename((path) => {
- currentFile = path;
- if (currentFile.dirname !== '.') {
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${
- currentFile.dirname
- }.json`,
- 'utf8'
- )
- );
- oldDataSource = currentFile.dirname;
- if (file.seo.slug) {
- currentFile.dirname = file.seo.slug;
- }
- }
- })
- )
- // Add access to site configuration
- .pipe(
- data(() => {
- let file = params.siteConfig;
- file = {
- SITE: {
- ...JSON.parse(fs.readFileSync(file)),
- },
- };
- return file;
- })
- )
- .pipe(
- gulpif(
- existsJson,
- data(() => {
- let file;
- params.dataSource.forEach((element) => {
- file = {
- ...file,
- ...JSON.parse(fs.readFileSync(element)),
- };
- });
- return file;
- })
- )
- )
- .pipe(
- gulpif(
- findJson,
- data(() => {
- if (currentFile.dirname === '.') {
- return JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/index.json`
- )
- );
- }
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${oldDataSource}.json`
- )
- );
- return file;
- })
- )
- )
- .pipe(
- nunjucksRender({
- data: { SOURCE: process.env.SOURCE },
- path: params.processPaths,
- manageEnv: (enviroment) => {
- enviroment.addFilter('date', dateFilter);
- enviroment.addFilter('md', markdown);
- enviroment.addFilter(
- 'unique',
- (arr) =>
- (arr instanceof Array &&
- arr.filter((e, i, arr1) => arr1.indexOf(e) === i)) ||
- arr
- );
- enviroment.addGlobal('toDate', (date) => {
- return date ? new Date(date) : new Date();
- });
- },
- })
- )
- .pipe(
- inject(
- gulp.src(params.injectCss, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- quiet: true,
- }
- )
- )
- .pipe(
- inject(
- gulp.src(params.injectJs, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- }
- )
- )
- // Remove multi/line comments
- .pipe(
- replace(
- '',
- params.injectCdnJs.toString().replace(/[, ]+/g, ' ')
- )
- )
- // Remove multi/line comments
- .pipe(replace(/( )*\n*/gm, ''))
- .pipe(
- minify({
- collapseWhitespace: true,
- })
- )
- .pipe(
- gulpif(
- renameCondition,
- rename({
- dirname: '/',
- basename: params.rename,
- extname: '.html',
- })
- )
- )
- .pipe(gulp.dest(params.output))
- .on('end', () => {
- params.cb();
- })
- );
-};
-
-module.exports = buildHtml;
diff --git a/gulp-tasks-build/gulp-process-js.js b/gulp-tasks-build/gulp-process-js.js
deleted file mode 100644
index 44f110c..0000000
--- a/gulp-tasks-build/gulp-process-js.js
+++ /dev/null
@@ -1,58 +0,0 @@
-const babel = require('gulp-babel');
-const gulp = require('gulp');
-const gulpConcat = require('gulp-concat');
-const gulpif = require('gulp-if');
-const newer = require('gulp-newer');
-const plumber = require('gulp-plumber');
-const uglify = require('gulp-uglify');
-
-/**
- * @description Transpile JavaScript files
- * @param {string,object} input Path with filter to source files
- * @param {string} output Path to save transpiled files
- * @param {object} params
- * @returns {*} Transpiled file/files
- */
-
-const processJs = (input, output, params = {}) => {
- const rewriteExisting = !!(
- params.rewriteExisting &&
- typeof params.rewriteExisting === 'boolean' &&
- params.rewriteExisting === true
- );
-
- const concatFiles = !!(
- params.concatFiles &&
- typeof params.concatFiles === 'boolean' &&
- params.concatFiles === true
- );
-
- const outputConcatFileName = `${params.outputConcatPrefixFileName}.min.js`;
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(gulpif(!rewriteExisting, newer(output)))
- .pipe(
- babel({
- presets: [
- [
- '@babel/preset-env',
- {
- targets: {
- browsers: ['last 2 versions'],
- },
- },
- ],
- ],
- })
- )
- .pipe(uglify())
- .pipe(gulpif(concatFiles, gulpConcat(outputConcatFileName)))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = processJs;
diff --git a/gulp-tasks-build/gulp-purgecss.js b/gulp-tasks-build/gulp-purgecss.js
deleted file mode 100644
index fda68e8..0000000
--- a/gulp-tasks-build/gulp-purgecss.js
+++ /dev/null
@@ -1,41 +0,0 @@
-const gulp = require('gulp');
-const plumber = require('gulp-plumber');
-const purgecss = require('gulp-purgecss');
-
-/**
- * @description Purge unused CSS selectors
- * @param {string} inputCss path to source CSS files
- * @param {string} inputHtml path to source HTML files
- * @param {string} outputCss path to folder to save optimized files
- * @param {object} params
- * @returns {*} processed files
- */
-
-const purgeCss = (inputCss, inputHtml, outputCss, params = {}) => {
- return gulp
- .src(inputCss)
- .pipe(plumber())
- .pipe(
- purgecss({
- content: inputHtml,
- safelist: {
- standard: [
- 'active',
- 'collapsing',
- 'fade',
- 'offcanvas-backdrop',
- 'open',
- 'scroll',
- 'show',
- ],
- },
- // rejected: true,
- })
- )
- .pipe(gulp.dest(outputCss))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = purgeCss;
diff --git a/gulp-tasks-build/gulp-revision.js b/gulp-tasks-build/gulp-revision.js
deleted file mode 100644
index 3b1a34c..0000000
--- a/gulp-tasks-build/gulp-revision.js
+++ /dev/null
@@ -1,38 +0,0 @@
-const gulp = require('gulp');
-const revDelete = require('gulp-rev-delete-original');
-const revReplace = require('gulp-rev-replace');
-const revRewrite = require('gulp-rev-rewrite');
-
-/**
- * @description Add version hash to files
- * @param {string} inputRevision path to CSS files
- * @param {string} outputRevision path to save files
- * @param {string} outPutManifest path to save manifest file
- * @param {string} inputRewrite path to HTML files which you want to rewrite
- * @param {string} manifestFile path to manifest file
- * @param {string} outputRewrite path to save rewrited HTML files
- * @returns {*} Files with version hash
- */
-
-const revision = async (params) => {
- const rev = await import('gulp-rev');
-
- return (
- gulp
- .src(params.inputRevision)
- .pipe(rev.default())
- .pipe(revReplace())
- .pipe(revDelete())
- .pipe(gulp.dest(params.outputRevision))
- .pipe(gulp.dest(params.ouputManifest))
- .pipe(gulp.src(params.inputRewrite))
- .pipe(revRewrite(params.manifestFile))
- .pipe(gulp.dest(params.outputRewrite))
- // .pipe(gulpBrotli())
- // .pipe(gulp.dest(params.outputRewrite))
- .on('end', () => {
- params.cb();
- })
- );
-};
-module.exports = revision;
diff --git a/gulp-tasks-build/gulp-sri-hash.js b/gulp-tasks-build/gulp-sri-hash.js
deleted file mode 100644
index 9866fa0..0000000
--- a/gulp-tasks-build/gulp-sri-hash.js
+++ /dev/null
@@ -1,22 +0,0 @@
-const gulp = require('gulp');
-const sri = require('gulp-sri-hash');
-
-/**
- * @description Add sri integrity hashes into link tags in html
- * @param {string} input path to HTML files
- * @param {string} output path to save HTML files
- * @param {object} params
- * @returns {*} HTML files with integrity hashes
- */
-
-const sriHash = (input, output, params = {}) => {
- return gulp
- .src(input)
- .pipe(sri())
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = sriHash;
diff --git a/gulp-tasks-export/gulp-compile-sass.js b/gulp-tasks-export/gulp-compile-sass.js
deleted file mode 100644
index 92a34cb..0000000
--- a/gulp-tasks-export/gulp-compile-sass.js
+++ /dev/null
@@ -1,47 +0,0 @@
-const gulp = require('gulp');
-const gulpConcat = require('gulp-concat');
-const gulpEmptyPipe = require('gulp-empty-pipe');
-const plumber = require('gulp-plumber');
-const postcss = require('gulp-postcss');
-const postcssSyntax = require('postcss-scss');
-const prettify = require('gulp-jsbeautifier');
-const replace = require('gulp-replace');
-const sass = require('gulp-sass')(require('sass'));
-const sassGlob = require('gulp-sass-glob');
-
-/**
- * @description Compiling SCSS files into CSS files
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} outputConcatFileName Output file name
- * @param {object} postcssPluginsBase Postcss plugins
- * @returns {*} Compiled file
- */
-
-const compileSass = (
- input,
- output,
- outputConcatFileName,
- postcssPluginsBase,
- params = {}
-) => {
- const processFile = outputConcatFileName ? gulpConcat : gulpEmptyPipe;
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(sassGlob())
- .pipe(sass())
- .on('error', sass.logError)
- .pipe(replace(/\/\*!/g, '/*'))
- .pipe(replace('@charset "UTF-8";', ''))
- .pipe(postcss(postcssPluginsBase, { syntax: postcssSyntax }))
- .pipe(prettify({ indent_size: 4 }))
- .pipe(processFile(outputConcatFileName))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = compileSass;
diff --git a/gulp-tasks-export/gulp-html-build.js b/gulp-tasks-export/gulp-html-build.js
deleted file mode 100644
index d3df04a..0000000
--- a/gulp-tasks-export/gulp-html-build.js
+++ /dev/null
@@ -1,218 +0,0 @@
-const data = require('gulp-data');
-const dateFilter = require('nunjucks-date-filter-locale');
-const fs = require('fs');
-const gulp = require('gulp');
-const gulpif = require('gulp-if');
-const inject = require('gulp-inject');
-const minify = require('gulp-htmlmin');
-
-const log = require('fancy-log');
-const markdown = require('nunjucks-markdown-filter');
-const nunjucksRender = require('gulp-nunjucks-render');
-const plumber = require('gulp-plumber');
-const prettify = require('gulp-html-beautify');
-const rename = require('gulp-rename');
-const replace = require('gulp-replace');
-require('dotenv').config();
-
-/**
- * @description Compile Nunjucks templates and replaces variable from JSON
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} dataSource Input file/path with data structure
- * @param {string} rename Custom name of file
- * @param {string} injectCss Path to css files which you want inject
- * @param {Array} injectJs Path to JS files which you want inject
- * @param {Array} injectCdnJs Path to CDN JS files which you want inject
- * @returns {*} Compiled file
- */
-
-const buildHtml = (params) => {
- // eslint-disable-next-line global-require, import/no-dynamic-require
- const localeSettings = require(`.${params.siteConfig}`);
- const renameCondition = !!params.rename;
- dateFilter.setLocale(localeSettings.meta.lang);
- let currentFile = '';
- let existsJson = false;
- let findJson = true;
- let oldDataSource = '';
-
- if (params.dataSource.includes('.json')) {
- if (typeof params.dataSource !== 'object') {
- params.dataSource = [params.dataSource];
- }
-
- params.dataSource.forEach((element) => {
- try {
- fs.accessSync(element);
- existsJson = true;
- findJson = false;
- } catch (error) {
- log.error(`buildHtml(): JSON file ${element} doesn't exists.`);
- existsJson = false;
- findJson = false;
- }
- });
- }
-
- nunjucksRender.nunjucks.configure(params.templates, {
- watch: false,
- lstripBlocks: true,
- throwOnUndefined: true,
- trimBlocks: true,
- stream: true,
- });
-
- return (
- gulp
- .src(params.input)
- .pipe(plumber())
- .pipe(
- rename((path) => {
- currentFile = path;
- if (currentFile.dirname !== '.') {
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${
- currentFile.dirname
- }.json`,
- 'utf8'
- )
- );
- oldDataSource = currentFile.dirname;
- if (file.seo.slug) {
- currentFile.dirname = file.seo.slug;
- }
- }
- })
- )
- // Add access to site configuration
- .pipe(
- data(() => {
- let file = params.siteConfig;
- file = {
- SITE: {
- ...JSON.parse(fs.readFileSync(file)),
- },
- };
- return file;
- })
- )
- .pipe(
- gulpif(
- existsJson,
- data(() => {
- let file;
- params.dataSource.forEach((element) => {
- file = {
- ...file,
- ...JSON.parse(fs.readFileSync(element)),
- };
- });
- return file;
- })
- )
- )
- .pipe(
- gulpif(
- findJson,
- data(() => {
- if (currentFile.dirname === '.') {
- return JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/index.json`
- )
- );
- }
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${oldDataSource}.json`
- )
- );
- return file;
- })
- )
- )
- .pipe(
- nunjucksRender({
- path: params.processPaths,
- manageEnv: (enviroment) => {
- enviroment.addFilter('date', dateFilter);
- enviroment.addFilter('md', markdown);
- enviroment.addFilter(
- 'unique',
- (arr) =>
- (arr instanceof Array &&
- arr.filter((e, i, arr1) => arr1.indexOf(e) === i)) ||
- arr
- );
- enviroment.addGlobal('toDate', (date) => {
- return date ? new Date(date) : new Date();
- });
- },
- })
- )
- .pipe(
- inject(
- gulp.src(params.injectCss, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- quiet: true,
- }
- )
- )
- .pipe(
- inject(
- gulp.src(params.injectJs, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- }
- )
- )
- .pipe(replace(/(href=["'])(\/assets)/g, '$1.$2'))
- .pipe(replace(/( )*\n*/gm, ''))
- .pipe(
- replace(
- '',
- params.injectCdnJs.toString().replace(/[, ]+/g, ' ')
- )
- )
- // Minify HTML - fix HTML structure like missng closing tags
- .pipe(minify({ collapseWhitespace: true }))
- // Beautify HTML
- .pipe(
- prettify({
- indentSize: 4,
- indent_char: ' ',
- indent_with_tabs: false,
- preserve_newlines: false,
- })
- )
- .pipe(
- gulpif(
- renameCondition,
- rename({
- dirname: '/',
- basename: params.rename,
- extname: '.html',
- })
- )
- )
- .pipe(gulp.dest(params.output))
- .on('end', () => {
- params.cb();
- })
- );
-};
-
-module.exports = buildHtml;
diff --git a/gulp-tasks-export/gulp-process-js.js b/gulp-tasks-export/gulp-process-js.js
deleted file mode 100644
index 44f110c..0000000
--- a/gulp-tasks-export/gulp-process-js.js
+++ /dev/null
@@ -1,58 +0,0 @@
-const babel = require('gulp-babel');
-const gulp = require('gulp');
-const gulpConcat = require('gulp-concat');
-const gulpif = require('gulp-if');
-const newer = require('gulp-newer');
-const plumber = require('gulp-plumber');
-const uglify = require('gulp-uglify');
-
-/**
- * @description Transpile JavaScript files
- * @param {string,object} input Path with filter to source files
- * @param {string} output Path to save transpiled files
- * @param {object} params
- * @returns {*} Transpiled file/files
- */
-
-const processJs = (input, output, params = {}) => {
- const rewriteExisting = !!(
- params.rewriteExisting &&
- typeof params.rewriteExisting === 'boolean' &&
- params.rewriteExisting === true
- );
-
- const concatFiles = !!(
- params.concatFiles &&
- typeof params.concatFiles === 'boolean' &&
- params.concatFiles === true
- );
-
- const outputConcatFileName = `${params.outputConcatPrefixFileName}.min.js`;
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(gulpif(!rewriteExisting, newer(output)))
- .pipe(
- babel({
- presets: [
- [
- '@babel/preset-env',
- {
- targets: {
- browsers: ['last 2 versions'],
- },
- },
- ],
- ],
- })
- )
- .pipe(uglify())
- .pipe(gulpif(concatFiles, gulpConcat(outputConcatFileName)))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = processJs;
diff --git a/gulp-tasks/gulp-clean.js b/gulp-tasks/gulp-clean.js
deleted file mode 100644
index e7e1269..0000000
--- a/gulp-tasks/gulp-clean.js
+++ /dev/null
@@ -1,18 +0,0 @@
-const gulp = require('gulp');
-const gulpClean = require('gulp-clean');
-const plumber = require('gulp-plumber');
-
-/**
- * @description Clean function
- * @param {string} input path to folder or file that you want to remove
- * @returns {*} Compiled file
- */
-
-const clean = (input) => {
- return gulp
- .src(input, { read: false, allowEmpty: true })
- .pipe(plumber())
- .pipe(gulpClean());
-};
-
-module.exports = clean;
diff --git a/gulp-tasks/gulp-compile-sass.js b/gulp-tasks/gulp-compile-sass.js
deleted file mode 100644
index 92cf174..0000000
--- a/gulp-tasks/gulp-compile-sass.js
+++ /dev/null
@@ -1,44 +0,0 @@
-const gulp = require('gulp');
-const gulpConcat = require('gulp-concat');
-const gulpEmptyPipe = require('gulp-empty-pipe');
-const plumber = require('gulp-plumber');
-const postcss = require('gulp-postcss');
-const postcssSyntax = require('postcss-scss');
-const prettify = require('gulp-jsbeautifier');
-const sass = require('gulp-sass')(require('sass'));
-const sassGlob = require('gulp-sass-glob');
-
-/**
- * @description Compiling SCSS files into CSS files
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} outputConcatFileName Output file name
- * @param {object} postcssPluginsBase Postcss plugins
- * @returns {*} Compiled file
- */
-
-const compileSass = (
- input,
- output,
- outputConcatFileName,
- postcssPluginsBase,
- params = {}
-) => {
- const processFile = outputConcatFileName ? gulpConcat : gulpEmptyPipe;
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(sassGlob())
- .pipe(sass())
- .on('error', sass.logError)
- .pipe(postcss(postcssPluginsBase, { syntax: postcssSyntax }))
- .pipe(prettify({ indent_size: 4 }))
- .pipe(processFile(outputConcatFileName))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = compileSass;
diff --git a/gulp-tasks/gulp-copy-static.js b/gulp-tasks/gulp-copy-static.js
deleted file mode 100644
index d6ffbb4..0000000
--- a/gulp-tasks/gulp-copy-static.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const gulp = require('gulp');
-const plumber = require('gulp-plumber');
-
-/**
- * @description Clean function
- * @param {string} input path to folder for copy
- * @param {string} basePath input base path
- * @param {string} output destination path
- * @param {object} parameters
- * @returns {*} Compiled file
- */
-
-const copy = (input, basePath, output, params = {}) => {
- return gulp
- .src(input, { base: basePath })
- .pipe(plumber())
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = copy;
diff --git a/gulp-tasks/gulp-dataset-prepare.js b/gulp-tasks/gulp-dataset-prepare.js
deleted file mode 100644
index 2203fc0..0000000
--- a/gulp-tasks/gulp-dataset-prepare.js
+++ /dev/null
@@ -1,63 +0,0 @@
-const { marked } = require('marked');
-const gulp = require('gulp');
-const log = require('fancy-log');
-const markdownToJSON = require('gulp-markdown-to-json');
-const plumber = require('gulp-plumber');
-const rename = require('gulp-rename');
-const through2 = require('through2');
-
-/**
- * @description Convert *.md to *.json
- * @param {string} input Path source *.md
- * @param {string} output Path to save files
- * @param {object} params
- * @returns {*} Processed files
- */
-
-marked.setOptions({
- mangle: false,
- headerIds: false,
-});
-
-const datasetPrepare = (input, output, params = {}) => {
- const files = [];
-
- return gulp
- .src(input)
- .pipe(plumber())
- .pipe(markdownToJSON(marked))
- .pipe(
- rename((path) => {
- if (path.dirname === '.' && path.basename === 'index') {
- return {
- basename: path.basename,
- dirname: '/',
- extname: '.json',
- };
- }
- if (path.dirname !== '.') {
- return {
- basename: path.dirname,
- dirname: '/',
- extname: '.json',
- };
- }
- return '';
- })
- )
- .pipe(gulp.dest(output))
- .pipe(
- through2.obj((file, enc, cb) => {
- files.push(file.path);
- cb();
- })
- )
- .on('end', () => {
- if (params.verbose) {
- log(` ${files.length} JSON written`);
- }
- params.cb();
- });
-};
-
-module.exports = datasetPrepare;
diff --git a/gulp-tasks/gulp-deploy-ftp.js b/gulp-tasks/gulp-deploy-ftp.js
deleted file mode 100644
index 664f273..0000000
--- a/gulp-tasks/gulp-deploy-ftp.js
+++ /dev/null
@@ -1,33 +0,0 @@
-const ftp = require('vinyl-ftp');
-const gulp = require('gulp');
-const log = require('fancy-log');
-require('dotenv').config();
-
-/**
- * @description Deploy files and folders to FTP
- * @param {string} input path to folder to deploy
- * @param {string} basePath input base path
- * @param {string} output destination path
- * @param {object} params
- * @returns {*} Compiled file
- */
-
-const deployFtp = (input, basePath, output, params = {}) => {
- const conn = ftp.create({
- host: process.env.FTP_HOST,
- user: process.env.FTP_USER,
- password: process.env.FTP_PASSWORD,
- parallel: 10,
- log,
- });
-
- return gulp
- .src(input, { basePath, buffer: false })
- .pipe(conn.newer(input))
- .pipe(conn.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = deployFtp;
diff --git a/gulp-tasks/gulp-favicons.js b/gulp-tasks/gulp-favicons.js
deleted file mode 100644
index 7fbfff5..0000000
--- a/gulp-tasks/gulp-favicons.js
+++ /dev/null
@@ -1,22 +0,0 @@
-const gulp = require('gulp');
-
-/**
- * @description generate favicon from source file
- * @param {string} input path to source icon
- * @param {string} output path to save icons
- * @param {object} params cofiguration for favicon generator
- */
-
-const iconGenerator = async (input, output, params) => {
- const favicons = await import('gulp-favicons');
-
- return gulp
- .src(input)
- .pipe(favicons.default(params.config))
- .pipe(gulp.dest(output))
- .on('end', () => {
- params.cb();
- });
-};
-
-module.exports = iconGenerator;
diff --git a/gulp-tasks/gulp-font-load.js b/gulp-tasks/gulp-font-load.js
deleted file mode 100644
index 859e6d6..0000000
--- a/gulp-tasks/gulp-font-load.js
+++ /dev/null
@@ -1,26 +0,0 @@
-const googleWebFonts = require('gulp-google-webfonts');
-const gulp = require('gulp');
-const log = require('fancy-log');
-
-/**
- * @description Download font from fonts.google.com into font folder and link them in fonts.css
- * @param {string} input Path to fonts.list file
- * @param {string} output Path to save files
- * @param {object} params Settings for googleWebFonts package
- * @returns {*} fonts in woff format inside font folder and fonts.css in css folder
- */
-
-const fontLoad = (input, output, params) => {
- return gulp
- .src(input)
- .pipe(googleWebFonts(params.config))
- .pipe(gulp.dest(output))
- .on('end', () => {
- if (params.verbose) {
- log('Font processed');
- }
- params.cb();
- });
-};
-
-module.exports = fontLoad;
diff --git a/gulp-tasks/gulp-hotreload.js b/gulp-tasks/gulp-hotreload.js
deleted file mode 100644
index 5424f82..0000000
--- a/gulp-tasks/gulp-hotreload.js
+++ /dev/null
@@ -1,34 +0,0 @@
-const browsersync = require('browser-sync').create();
-const config = require('../gulpconfig');
-
-/**
- * @description BrowserSync init and config
- */
-
-function browserSync() {
- browsersync.init({
- server: {
- baseDir: config.buildBase,
- },
- port: 4000,
- notify: false,
- open: false,
- });
-}
-
-/**
- * @description BrowserSync reload
- */
-function browserSyncRefresh(done) {
- browsersync.reload();
- done();
-}
-
-/**
- *
- */
-function browserSyncReload() {
- browsersync.reload();
-}
-
-module.exports = { browserSync, browserSyncRefresh, browserSyncReload };
diff --git a/gulp-tasks/gulp-html-build.js b/gulp-tasks/gulp-html-build.js
deleted file mode 100644
index fb36c87..0000000
--- a/gulp-tasks/gulp-html-build.js
+++ /dev/null
@@ -1,212 +0,0 @@
-const data = require('gulp-data');
-const dateFilter = require('nunjucks-date-filter-locale');
-const fs = require('fs');
-const gulp = require('gulp');
-const gulpif = require('gulp-if');
-const inject = require('gulp-inject');
-const log = require('fancy-log');
-const markdown = require('nunjucks-markdown-filter');
-const nunjucksRender = require('gulp-nunjucks-render');
-const plumber = require('gulp-plumber');
-const prettify = require('gulp-html-beautify');
-const rename = require('gulp-rename');
-const replace = require('gulp-replace');
-require('dotenv').config();
-
-/**
- * @description Compile Nunjucks templates and replaces variable from JSON
- * @param {string} input Path with filter to source files
- * @param {string} output Path to save compiled files
- * @param {string} dataSource Input file/path with data structure
- * @param {string} rename Custom name of file
- * @param {string} injectCss Path to css files which you want inject
- * @param {Array} injectJs Path to JS files which you want inject
- * @param {Array} injectCdnJs Path to CDN JS files which you want inject
- * @returns {*} Compiled file
- */
-
-const buildHtml = (params) => {
- // eslint-disable-next-line global-require, import/no-dynamic-require
- const localeSettings = require(`.${params.siteConfig}`);
- dateFilter.setLocale(localeSettings.meta.lang);
-
- let existsJson = false;
- let findJson = true;
- let currentFile = '';
- const renameCondition = !!params.rename;
- let oldDataSource = '';
-
- if (params.dataSource.includes('.json')) {
- if (typeof params.dataSource !== 'object') {
- params.dataSource = [params.dataSource];
- }
-
- params.dataSource.forEach((element) => {
- try {
- fs.accessSync(element);
- existsJson = true;
- findJson = false;
- } catch (error) {
- log.error(`buildHtml(): JSON file ${element} doesn't exists.`);
- existsJson = false;
- findJson = false;
- }
- });
- }
-
- nunjucksRender.nunjucks.configure(params.templates, {
- watch: false,
- lstripBlocks: true,
- throwOnUndefined: true,
- trimBlocks: true,
- stream: true,
- });
-
- return (
- gulp
- .src(params.input)
- .pipe(plumber())
- .pipe(
- rename((path) => {
- currentFile = path;
- if (currentFile.dirname !== '.') {
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${
- currentFile.dirname
- }.json`,
- 'utf8'
- )
- );
- oldDataSource = currentFile.dirname;
- if (file.seo.slug) {
- currentFile.dirname = file.seo.slug;
- }
- }
- })
- )
- // Add access to site configuration
- .pipe(
- data(() => {
- let file = params.siteConfig;
- file = {
- SITE: {
- ...JSON.parse(fs.readFileSync(file)),
- },
- };
- return file;
- })
- )
- .pipe(
- gulpif(
- existsJson,
- data(() => {
- let file;
- params.dataSource.forEach((element) => {
- file = {
- ...file,
- ...JSON.parse(fs.readFileSync(element)),
- };
- });
- return file;
- })
- )
- )
- .pipe(
- gulpif(
- findJson,
- data(() => {
- if (currentFile.dirname === '.') {
- return JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/index.json`
- )
- );
- }
- const file = JSON.parse(
- fs.readFileSync(
- `${process.cwd()}/${params.dataSource}/${oldDataSource}.json`
- )
- );
- return file;
- })
- )
- )
- .pipe(
- nunjucksRender({
- data: { SOURCE: process.env.SOURCE },
- path: params.processPaths,
- manageEnv: (enviroment) => {
- enviroment.addFilter('date', dateFilter);
- enviroment.addFilter('md', markdown);
- enviroment.addFilter(
- 'unique',
- (arr) =>
- (arr instanceof Array &&
- arr.filter((e, i, arr1) => arr1.indexOf(e) === i)) ||
- arr
- );
- enviroment.addGlobal('toDate', (date) => {
- return date ? new Date(date) : new Date();
- });
- },
- })
- )
- .pipe(
- inject(
- gulp.src(params.injectCss, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- }
- )
- )
- .pipe(
- inject(
- gulp.src(params.injectJs, {
- read: false,
- }),
- {
- relative: false,
- ignorePath: params.injectIgnorePath,
- addRootSlash: true,
- removeTags: true,
- }
- )
- )
- .pipe(
- replace(
- '',
- params.injectCdnJs.toString().replace(/[, ]+/g, ' ')
- )
- )
- .pipe(
- prettify({
- indentSize: 4,
- indent_char: ' ',
- indent_with_tabs: false,
- preserve_newlines: false,
- })
- )
- .pipe(
- gulpif(
- renameCondition,
- rename({
- dirname: '/',
- basename: params.rename,
- extname: '.html',
- })
- )
- )
- .pipe(gulp.dest(params.output))
- .on('end', () => {
- params.cb();
- })
- );
-};
-
-module.exports = buildHtml;
diff --git a/gulp-tasks/gulp-html-validate.js b/gulp-tasks/gulp-html-validate.js
deleted file mode 100644
index aefae26..0000000
--- a/gulp-tasks/gulp-html-validate.js
+++ /dev/null
@@ -1,21 +0,0 @@
-const gulp = require('gulp');
-const validate = require('gulp-html-validate');
-
-const htmlValidate = (input) => {
- return (
- gulp
- .src(input)
-
- // Aaply the `html-validate` report to each file object, so these
- // can be used by other modules.
- .pipe(validate())
-
- // Output `html-validate` results to the console.
- .pipe(validate.format())
-
- // Make gulp to exit with an error code if any error(s) occurred.
- .pipe(validate.failAfterError())
- );
-};
-
-module.exports = htmlValidate;
diff --git a/gulp-tasks/gulp-optimize-images.js b/gulp-tasks/gulp-optimize-images.js
deleted file mode 100644
index e15769f..0000000
--- a/gulp-tasks/gulp-optimize-images.js
+++ /dev/null
@@ -1,104 +0,0 @@
-const gulp = require('gulp');
-const gulpif = require('gulp-if');
-const log = require('fancy-log');
-const newer = require('gulp-newer');
-const plumber = require('gulp-plumber');
-const upng = require('gulp-upng');
-
-async function loadPlugin(plugin) {
- try {
- const module = await import(plugin);
- return module.default || module;
- } catch (error) {
- log.error(`Failed to load plugin: ${plugin}`);
- throw error;
- }
-}
-
-async function processImages(input, output, plugins, params = {}) {
- const imagemin = await loadPlugin('gulp-imagemin');
-
- const rewriteExisting = !!(
- params.rewriteExisting &&
- typeof params.rewriteExisting === 'boolean' &&
- params.rewriteExisting === true
- );
-
- if (params.verbose) {
- log(`🟡🟡🟡 Start: ${output}`);
- }
-
- gulp
- .src(input)
- .pipe(plumber())
- .pipe(gulpif(!rewriteExisting, newer(output)))
- .pipe(imagemin(plugins))
- .pipe(gulp.dest(output))
- .on('end', () => {
- if (params.verbose) {
- log(`🟡🟡🟡 End: ${output}`);
- }
- params.cb();
- });
-}
-
-const optimizeJpg = async (input, output, params = {}) => {
- const mozjpeg = await loadPlugin('imagemin-mozjpeg');
- const plugins = [
- mozjpeg({
- quantTable: 3,
- dcScanOpt: 2,
- }),
- ];
- await processImages(input, output, plugins, params);
-};
-
-const optimizePng = (input, output, params = {}) => {
- const rewriteExisting = !!(
- params.rewriteExisting &&
- typeof params.rewriteExisting === 'boolean' &&
- params.rewriteExisting === true
- );
-
- if (params.verbose) {
- log(` 🟡🟡 Start: ${output}/*.png`);
- }
-
- gulp
- .src(input)
- .pipe(plumber())
- .pipe(gulpif(!rewriteExisting, newer(output)))
- .pipe(upng({}))
- .pipe(gulp.dest(output))
- .on('end', () => {
- if (params.verbose) {
- log(` 🟡🟡 End: ${output}/*.png`);
- }
- params.cb();
- });
-};
-
-const optimizeSvg = async (input, output, params = {}) => {
- const svgo = await loadPlugin('imagemin-svgo');
- const plugins = [
- svgo({
- plugins: [
- {
- name: 'removeViewBox',
- active: false,
- },
- {
- name: 'collapseGroups',
- active: true,
- },
- ],
- }),
- ];
- await processImages(input, output, plugins, params);
-};
-
-module.exports = {
- optimizeJpg,
- optimizePng,
- optimizeSvg,
-};
diff --git a/gulp-tasks/gulp-todo.js b/gulp-tasks/gulp-todo.js
deleted file mode 100644
index bfdc08e..0000000
--- a/gulp-tasks/gulp-todo.js
+++ /dev/null
@@ -1,33 +0,0 @@
-const cp = require('child_process');
-const gulp = require('gulp');
-const gulpClean = require('gulp-clean');
-const gulpif = require('gulp-if');
-const replace = require('gulp-replace');
-const todo = require('gulp-todo');
-
-/**
- * @description Create list of TODOs and FIXMEs from source code
- * @returns {*} Compiled file
- */
-
-const buildTodo = () => {
- // generate a todo.md from your javascript files
- return gulp
- .src(['*.js', '!(node_modules)**/*.js'])
- .pipe(todo())
- .pipe(replace('### ', '## '))
- .pipe(
- gulpif(
- (file) => {
- return file.todos && Boolean(file.todos.length);
- },
- gulp.dest('./'),
- gulpClean()
- )
- )
- .on('finish', () => {
- return cp.exec('npx remark-cli -q ./TODO.md -o -- && git add ./TODO.md');
- });
-};
-
-module.exports = buildTodo;
diff --git a/gulp/config.js b/gulp/config.js
new file mode 100644
index 0000000..2980b6c
--- /dev/null
+++ b/gulp/config.js
@@ -0,0 +1,248 @@
+import pkg from '../package.json' with { type: 'json' }
+import { getEnv } from './utils/env.js'
+
+// Static base paths for the project.
+export const srcBase = './src'
+export const routesBase = './src/routes'
+export const staticBase = './static'
+
+export const tempBase = '.temp'
+
+// Shared favicon configuration for all build modes.
+export const faviconGenConfig = {
+ appName: pkg.name,
+ appShortName: pkg.name,
+ appDescription: pkg.description || undefined,
+ developerName: pkg.author || undefined,
+ developerURL: pkg.homepage || undefined,
+ background: '#000000',
+ path: '/assets/favicons/',
+ url: getBaseUrl(),
+ display: 'standalone',
+ orientation: 'portrait',
+ scope: '/',
+ start_url: '/index.html',
+ version: pkg.version,
+ logging: false,
+ html: 'favicons.njk',
+ pipeHTML: true,
+ replace: false,
+ icons: {
+ android: true,
+ appleIcon: true,
+ appleStartup: false,
+ coast: false,
+ favicons: true,
+ firefox: false,
+ windows: true,
+ yandex: false,
+ },
+}
+
+// Base configurations for different build modes (dev, build, export).
+const configs = {
+ dev: {
+ version: 'dev',
+ buildBase: './build-dev',
+ postcssPluginsBase: [],
+ minifyJs: false,
+ minifyCss: false,
+ concatFiles: false,
+ optimizeImages: false,
+ sourceMaps: true,
+ generateFavicons: false,
+ faviconGenConfig,
+ injectCdnJs: [],
+ injectJs: [`./build-dev/js/**/*.js`],
+ injectCss: [`./build-dev/css/**/*.css`],
+ },
+
+ build: {
+ version: 'prod',
+ buildBase: './build-prod',
+ postcssPluginsBase: [],
+ minifyJs: true,
+ minifyCss: true,
+ concatFiles: true,
+ optimizeImages: true,
+ sourceMaps: false,
+ generateFavicons: true,
+ faviconGenConfig,
+ injectCdnJs: [],
+ injectJs: [`./build-prod/js/**/*.js`],
+ injectCss: [`./build-prod/css/**/*.css`],
+ },
+
+ export: {
+ version: 'export',
+ buildBase: './build-export',
+ postcssPluginsBase: [],
+ minifyJs: false,
+ minifyCss: false,
+ concatFiles: false,
+ optimizeImages: true,
+ sourceMaps: false,
+ generateFavicons: true,
+ faviconGenConfig,
+ formatCode: true,
+ injectCdnJs: [],
+ injectJs: [],
+ injectCss: [],
+ },
+}
+
+/**
+ * Get the current build mode from environment or default to 'dev'.
+ * @returns {string} Build mode: 'dev', 'build', or 'export'
+ */
+function getCurrentBuildMode() {
+ return process.env.BUILD_MODE || 'dev'
+}
+
+/**
+ * Get the current configuration object for the active build mode.
+ * @returns {object} Configuration object for the current build mode
+ */
+function getCurrentConfig() {
+ const buildMode = getCurrentBuildMode()
+ return configs[buildMode] || configs.dev
+}
+
+// Static source paths for various assets.
+export const sassBase = `${srcBase}/scss`
+export const sassCore = `${sassBase}/bootstrap.scss`
+export const sassCustom = `${sassBase}/custom.scss`
+export const sassUtils = `${sassBase}/utils.scss`
+export const sassComponentsGlob = `${srcBase}/lib/components/**/*.scss`
+export const sassWatch = [
+ `${sassBase}/**/*.scss`,
+ `${srcBase}/lib/components/**/*.scss`,
+]
+
+export const jsBase = `${srcBase}/js`
+export const jsFiles = `${jsBase}/**/*.js`
+
+export const contentBase = routesBase
+export const datasetPagesSource = `${routesBase}/**/*.md`
+export const datasetPagesBuild = `${tempBase}/pages`
+
+export const tplPagesBase = routesBase
+export const tplTemplatesBase = `${srcBase}/lib`
+export const tplExtension = '.njk'
+
+export const templatesBase = `${srcBase}/lib`
+export const componentsPath = `${srcBase}/lib/components`
+
+export const templateWatchPaths = [
+ `${componentsPath}/**/*.*`,
+ `${routesBase}/**/*.*`,
+]
+
+export const assetsBase = `${srcBase}/assets`
+export const fontsBase = `${assetsBase}/fonts`
+export const iconsBase = `${assetsBase}/icons`
+export const imagesBase = `${assetsBase}/images`
+
+// Image source patterns for different image types.
+export const imagesJpg = `${imagesBase}/**/*.{jpg,jpeg}`
+export const imagesPng = `${imagesBase}/**/*.png`
+export const imagesSvg = `${imagesBase}/**/*.svg`
+
+// Font configuration file path.
+export const fontloadFile = `${srcBase}/config/fonts.list`
+
+// Site configuration file path.
+export const siteConfigFile = `${srcBase}/config/site.js`
+
+// Dynamic exports using getters to ensure the current build mode's configuration is always used.
+export const version = () => getCurrentConfig().version
+export const buildBase = () => getCurrentConfig().buildBase
+export const sourceMaps = () => getCurrentConfig().sourceMaps
+export const postcssPluginsBase = () => getCurrentConfig().postcssPluginsBase
+export const injectCdnJs = () => getCurrentConfig().injectCdnJs
+export const injectJs = () =>
+ getCurrentConfig().injectJs.map((path) =>
+ path.replace(/\.\/build(-[^/]+)?/, getCurrentConfig().buildBase)
+ )
+export const injectCss = () =>
+ getCurrentConfig().injectCss.map((path) =>
+ path.replace(/\.\/build(-[^/]+)?/, getCurrentConfig().buildBase)
+ )
+
+export const minifyJs = () => getCurrentConfig().minifyJs || false
+export const minifyCss = () => getCurrentConfig().minifyCss || false
+export const concatFiles = () => getCurrentConfig().concatFiles || false
+export const optimizeImages = () => getCurrentConfig().optimizeImages || false
+export const generateFavicons = () =>
+ getCurrentConfig().generateFavicons || false
+export const formatCode = () => getCurrentConfig().formatCode || false
+
+// Dynamic build paths that depend on the current build mode.
+export const sassBuild = () => `${getCurrentConfig().buildBase}/css`
+export const jsBuild = () => `${getCurrentConfig().buildBase}/js`
+export const fontsBuild = () => `${getCurrentConfig().buildBase}/assets/fonts`
+export const iconsBuild = () => `${getCurrentConfig().buildBase}/assets/icons`
+export const imagesBuild = () => `${getCurrentConfig().buildBase}/assets/images`
+export const faviconBuild = () =>
+ `${getCurrentConfig().buildBase}/assets/favicons`
+export const tplBuild = () => getCurrentConfig().buildBase
+
+export const fontLoadConfig = () => ({
+ fontsDir: fontsBase,
+ outputDir: `${getCurrentConfig().buildBase}/assets/fonts`,
+})
+
+/**
+ * Get configuration for specific build mode
+ * @param {string} mode - Build mode: 'dev', 'build', or 'export'
+ * @returns {object} Configuration object for the specified mode
+ */
+export function getConfig(mode = 'dev') {
+ return configs[mode] || configs.dev
+}
+
+/**
+ * Get build-specific paths for given mode
+ * @param {string} mode - Build mode: 'dev', 'build', or 'export'
+ * @returns {object} Object containing build-specific paths
+ */
+export function getBuildPaths(mode = getCurrentBuildMode()) {
+ const config = getConfig(mode)
+ return {
+ buildBase: config.buildBase,
+ sassBuild: `${config.buildBase}/css`,
+ jsBuild: `${config.buildBase}/js`,
+ fontsBuild: `${config.buildBase}/assets/fonts`,
+ iconsBuild: `${config.buildBase}/assets/icons`,
+ imagesBuild: `${config.buildBase}/assets/images`,
+ faviconBuild: `${config.buildBase}/assets/favicons`,
+ tplBuild: config.buildBase,
+ }
+}
+
+/**
+ * Get build configuration flags for given mode
+ * @param {string} mode - Build mode: 'dev', 'build', or 'export'
+ * @returns {object} Object containing build configuration flags
+ */
+export function getBuildConfig(mode = getCurrentBuildMode()) {
+ const config = getConfig(mode)
+ return {
+ minifyJs: config.minifyJs || false,
+ minifyCss: config.minifyCss || false,
+ concatFiles: config.concatFiles || false,
+ optimizeImages: config.optimizeImages || false,
+ generateFavicons: config.generateFavicons || false,
+ formatCode: config.formatCode || false,
+ sourceMaps: config.sourceMaps,
+ faviconGenConfig: config.faviconGenConfig,
+ }
+}
+
+/**
+ * Get the site base URL from environment or fallback to default.
+ * @returns {string} The base URL for the site.
+ */
+export function getBaseUrl() {
+ return getEnv('SITE_BASE_URL', undefined)
+}
diff --git a/gulp/tasks/clean.js b/gulp/tasks/clean.js
new file mode 100644
index 0000000..b979907
--- /dev/null
+++ b/gulp/tasks/clean.js
@@ -0,0 +1,37 @@
+import { getRelativePath, handleEmptyPaths } from '../utils/helpers.js'
+import logger from '../utils/logger.js'
+import { deleteAsync } from 'del'
+
+/**
+ * Clean specified directories using modern async/await pattern.
+ * @param {string|string[]} paths - Paths to clean.
+ * @returns {Promise