From cbb3aee3ed900cc5f9972603045ae2d831408ec8 Mon Sep 17 00:00:00 2001
From: Bruno Alla <alla.brunoo@gmail.com>
Date: Tue, 26 Nov 2024 23:58:03 +0100
Subject: [PATCH] Convert Gulpfile to ESM

---
 hooks/post_gen_project.py                     |  2 +-
 .../{gulpfile.js => gulpfile.mjs}             | 43 +++++++++++--------
 2 files changed, 25 insertions(+), 20 deletions(-)
 rename {{cookiecutter.project_slug}}/{gulpfile.js => gulpfile.mjs} (83%)

diff --git a/hooks/post_gen_project.py b/hooks/post_gen_project.py
index 081e806c5..844b1e850 100644
--- a/hooks/post_gen_project.py
+++ b/hooks/post_gen_project.py
@@ -179,7 +179,7 @@ def handle_js_runner(choice, use_docker, use_async):
             remove_keys=["babel"],
             scripts={
                 "dev": "gulp",
-                "build": "gulp generate-assets",
+                "build": "gulp build",
             },
         )
         remove_webpack_files()
diff --git a/{{cookiecutter.project_slug}}/gulpfile.js b/{{cookiecutter.project_slug}}/gulpfile.mjs
similarity index 83%
rename from {{cookiecutter.project_slug}}/gulpfile.js
rename to {{cookiecutter.project_slug}}/gulpfile.mjs
index ee6e70282..339007d40 100644
--- a/{{cookiecutter.project_slug}}/gulpfile.js
+++ b/{{cookiecutter.project_slug}}/gulpfile.mjs
@@ -3,24 +3,29 @@
 ////////////////////////////////
 
 // Gulp and package
-const { src, dest, parallel, series, watch } = require('gulp');
-const pjson = require('./package.json');
+import { src, dest, parallel, series, watch } from 'gulp';
+import pjson from './package.json' with {type: 'json'};
 
 // Plugins
-const autoprefixer = require('autoprefixer');
-const browserSync = require('browser-sync').create();
-const concat = require('gulp-concat');
-const tildeImporter = require('node-sass-tilde-importer');
-const cssnano = require('cssnano');
-const imagemin = require('gulp-imagemin');
-const pixrem = require('pixrem');
-const plumber = require('gulp-plumber');
-const postcss = require('gulp-postcss');
+import autoprefixer from 'autoprefixer';
+import browserSyncLib from 'browser-sync';
+import concat from 'gulp-concat';
+import tildeImporter from 'node-sass-tilde-importer';
+import cssnano from 'cssnano';
+import imagemin from 'gulp-imagemin';
+import pixrem from 'pixrem';
+import plumber from 'gulp-plumber';
+import postcss from 'gulp-postcss';
+import rename from 'gulp-rename';
+import gulpSass from 'gulp-sass';
+import sassLib from 'sass';
+import gulUglifyES from 'gulp-uglify-es';
+import { spawn } from 'node:child_process';
+
+const browserSync = browserSyncLib.create();
 const reload = browserSync.reload;
-const rename = require('gulp-rename');
-const sass = require('gulp-sass')(require('sass'));
-const spawn = require('child_process').spawn;
-const uglify = require('gulp-uglify-es').default;
+const sass = gulpSass(sassLib);
+const uglify = gulUglifyES.default;
 
 // Relative paths function
 function pathsConfig(appName) {
@@ -163,7 +168,7 @@ function watchPaths() {
 }
 
 // Generate all assets
-const generateAssets = parallel(styles, scripts, vendorScripts, imgCompression);
+const build = parallel(styles, scripts, vendorScripts, imgCompression);
 
 // Set up dev environment
 {%- if cookiecutter.use_docker == 'n' %}
@@ -176,6 +181,6 @@ const dev = parallel(runServer, initBrowserSync, watchPaths);
 const dev = parallel(initBrowserSync, watchPaths);
 {%- endif %}
 
-exports.default = series(generateAssets, dev);
-exports['generate-assets'] = generateAssets;
-exports['dev'] = dev;
+export default series(build, dev);
+export build;
+export dev;