From 2373957ade969924c417d124c060328ba484f49b Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Wed, 22 Mar 2023 09:50:17 +0000 Subject: [PATCH 1/4] Rename Gulp `compile` task to `build:app` --- docs/contributing/tasks.md | 2 +- gulpfile.mjs | 28 ++++++++++++++-------------- package.json | 2 +- tasks/task-arguments.mjs | 2 +- tasks/task-arguments.unit.test.mjs | 8 ++++---- 5 files changed, 21 insertions(+), 21 deletions(-) diff --git a/docs/contributing/tasks.md b/docs/contributing/tasks.md index ec9f8e2f18..5f6750ba07 100644 --- a/docs/contributing/tasks.md +++ b/docs/contributing/tasks.md @@ -83,7 +83,7 @@ This task will: - compile JavaScript ESM to CommonJS into `./public`, or another location via the `--destination` flag - compile JavaScript documentation into `./jsdoc` -**`gulp compile`** +**`gulp build:app`** This task will: diff --git a/gulpfile.mjs b/gulpfile.mjs index 286381a9ba..58f7d946ad 100644 --- a/gulpfile.mjs +++ b/gulpfile.mjs @@ -35,10 +35,10 @@ gulp.task('styles', gulp.series( )) /** - * Compile task for local & heroku - * Runs JavaScript and Sass compilation, including documentation + * Build review app task + * Prepare public folder for review app */ -gulp.task('compile', gulp.series( +gulp.task('build:app', gulp.series( clean, copyAssets, compileJavaScripts, @@ -47,16 +47,6 @@ gulp.task('compile', gulp.series( npmScriptTask('build:sassdoc') )) -/** - * Dev task - * Runs a sequence of tasks on start - */ -gulp.task('dev', gulp.series( - 'compile', - watch, - npmScriptTask('serve', ['--workspace', 'app']) -)) - /** * Build package task * Prepare package folder for publishing @@ -74,10 +64,20 @@ gulp.task('build:package', gulp.series( * Prepare dist folder for release */ gulp.task('build:dist', gulp.series( - 'compile', + 'build:app', updateAssetsVersion )) +/** + * Dev task + * Runs a sequence of tasks on start + */ +gulp.task('dev', gulp.series( + 'build:app', + watch, + npmScriptTask('serve', ['--workspace', 'app']) +)) + /** * Default task * Lists out available tasks diff --git a/package.json b/package.json index 48d770b0d0..27cdc242d1 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,7 @@ "build-release": "./bin/build-release.sh", "publish-release": "./bin/publish-release.sh", "pre-release": "./bin/pre-release.sh", - "build:compile": "gulp compile", + "build:compile": "gulp build:app", "build:sassdoc": "sassdoc --config sassdoc.config.yaml ./src/govuk", "build:jsdoc": "jsdoc --configure jsdoc.config.js ./src/govuk", "build:package": "gulp build:package --destination \"package\"", diff --git a/tasks/task-arguments.mjs b/tasks/task-arguments.mjs index ec7a7ef315..c551fd4095 100644 --- a/tasks/task-arguments.mjs +++ b/tasks/task-arguments.mjs @@ -12,7 +12,7 @@ export const argv = parser(process.argv, { // Defaults for known tasks const destinations = [ { - task: 'compile', + task: 'build:app', destination: 'public' }, { diff --git a/tasks/task-arguments.unit.test.mjs b/tasks/task-arguments.unit.test.mjs index ee90ce5346..79fd393b20 100644 --- a/tasks/task-arguments.unit.test.mjs +++ b/tasks/task-arguments.unit.test.mjs @@ -36,8 +36,8 @@ describe('Task arguments', () => { expect(destination).toEqual(paths.public) }) - it('defaults to ./public for "gulp build:compile"', async () => { - process.argv = [...argv, 'build:compile'] + it('defaults to ./public for "gulp build:app"', async () => { + process.argv = [...argv, 'build:app'] const { destination } = await import('./task-arguments.mjs') expect(destination).toEqual(paths.public) @@ -85,8 +85,8 @@ describe('Task arguments', () => { expect(destination).toEqual(expected) }) - it('uses flag for "gulp build:compile"', async () => { - process.argv = [...argv, 'build:compile', '--destination', flag] + it('uses flag for "gulp build:app"', async () => { + process.argv = [...argv, 'build:app', '--destination', flag] const { destination } = await import('./task-arguments.mjs') expect(destination).toEqual(expected) From 163b4e6ccb26aeb0c09a1fb88bee1c4361f684c2 Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Wed, 22 Mar 2023 10:35:49 +0000 Subject: [PATCH 2/4] Rename npm `build:compile` script to `build:app` --- .github/workflows/actions/build/action.yml | 2 +- docs/contributing/tasks.md | 24 ++++++++-------------- package.json | 6 +++--- 3 files changed, 13 insertions(+), 19 deletions(-) diff --git a/.github/workflows/actions/build/action.yml b/.github/workflows/actions/build/action.yml index e61aeb73c0..e71347eb88 100644 --- a/.github/workflows/actions/build/action.yml +++ b/.github/workflows/actions/build/action.yml @@ -29,4 +29,4 @@ runs: if: steps.build-cache.outputs.cache-hit != 'true' shell: bash - run: npm run build:compile + run: npm run build:app diff --git a/docs/contributing/tasks.md b/docs/contributing/tasks.md index 5f6750ba07..ca4b69526b 100644 --- a/docs/contributing/tasks.md +++ b/docs/contributing/tasks.md @@ -28,19 +28,23 @@ npm scripts are defined in `package.json`. These trigger a number of Gulp tasks. **`npm run heroku` runs on Heroku build/PR and it will:** -- run `npm run build:compile` +- run `npm run build:app` - start up Express -**`npm run build:compile` will do the following:** +**`npm run build:app` will do the following:** +- clean the `./public` folder - output files into `./public`, or another location via the `--destination` flag - copy fonts and images -- compile JavaScript and Sass, including documentation +- run sub tasks from `gulp styles` without StyleLint code quality checks +- run sub tasks from `gulp scripts` without ESLint code quality checks +- compile Sass documentation into `./sassdoc` +- compile JavaScript documentation into `./jsdoc` **`npm run build:package` will do the following:** -- output files into `./package`, or another location via the `--destination` flag - clean the `./package` folder +- output files into `./package`, or another location via the `--destination` flag - copy Sass files, applying Autoprefixer via PostCSS - copy Nunjucks component template/macro files, including JSON configs - copy GOV.UK Prototype Kit config files @@ -50,8 +54,8 @@ npm scripts are defined in `package.json`. These trigger a number of Gulp tasks. **`npm run build:dist` will do the following:** -- output files into `./dist`, or another location via the `--destination` flag - clean the `./dist` folder +- output files into `./dist`, or another location via the `--destination` flag - copy fonts and images - compile JavaScript and Sass, including documentation - append version number from `package/package.json` to compiled JavaScript and CSS files @@ -83,16 +87,6 @@ This task will: - compile JavaScript ESM to CommonJS into `./public`, or another location via the `--destination` flag - compile JavaScript documentation into `./jsdoc` -**`gulp build:app`** - -This task will: - -- copy fonts and images -- run sub tasks from `gulp styles` without ESLint code quality checks -- run sub tasks from `gulp scripts` without StyleLint code quality checks -- compile Sass documentation into `./sassdoc` -- compile JavaScript documentation into `./jsdoc` - ## Express app only To start the Express app without Gulp tasks being triggered, run `npm run serve`. diff --git a/package.json b/package.json index 27cdc242d1..2d4d723655 100644 --- a/package.json +++ b/package.json @@ -16,19 +16,19 @@ "postinstall": "npm ls --depth=0", "start": "gulp dev", "serve": "npm run serve --workspace app", - "heroku": "npm run build:compile && npm start --workspace app", + "heroku": "npm run build:app && npm start --workspace app", "build-release": "./bin/build-release.sh", "publish-release": "./bin/publish-release.sh", "pre-release": "./bin/pre-release.sh", - "build:compile": "gulp build:app", "build:sassdoc": "sassdoc --config sassdoc.config.yaml ./src/govuk", "build:jsdoc": "jsdoc --configure jsdoc.config.js ./src/govuk", + "build:app": "gulp build:app --destination \"public\"", "build:package": "gulp build:package --destination \"package\"", "build:dist": "gulp build:dist --destination \"dist\"", "build:types": "tsc --build", "postbuild:package": "jest --color --selectProjects \"Gulp tasks\" --testMatch \"**/*build-package*\"", "postbuild:dist": "jest --color --selectProjects \"Gulp tasks\" --testMatch \"**/*build-dist*\"", - "pretest": "npm run build:compile", + "pretest": "npm run build:app", "test": "jest --color --ignoreProjects \"Gulp tasks\" --maxWorkers=50%", "test:screenshots": "node ./tasks/screenshot-components.mjs", "lint": "npm run lint:editorconfig && npm run lint:prettier && npm run lint:js && npm run lint:scss", From 0de4a19c1d4416a8f5ba04d851c9a86a4844c4f9 Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Thu, 9 Mar 2023 17:13:54 +0000 Subject: [PATCH 3/4] Prevent `build:dist` from building documentation --- docs/contributing/tasks.md | 2 +- gulpfile.mjs | 5 ++++- 2 files changed, 5 insertions(+), 2 deletions(-) diff --git a/docs/contributing/tasks.md b/docs/contributing/tasks.md index ca4b69526b..41fc1da655 100644 --- a/docs/contributing/tasks.md +++ b/docs/contributing/tasks.md @@ -57,7 +57,7 @@ npm scripts are defined in `package.json`. These trigger a number of Gulp tasks. - clean the `./dist` folder - output files into `./dist`, or another location via the `--destination` flag - copy fonts and images -- compile JavaScript and Sass, including documentation +- compile JavaScript and Sass - append version number from `package/package.json` to compiled JavaScript and CSS files - runs `npm run test:build:dist` (which will test the output is correct) diff --git a/gulpfile.mjs b/gulpfile.mjs index 58f7d946ad..504d1c6717 100644 --- a/gulpfile.mjs +++ b/gulpfile.mjs @@ -64,7 +64,10 @@ gulp.task('build:package', gulp.series( * Prepare dist folder for release */ gulp.task('build:dist', gulp.series( - 'build:app', + clean, + copyAssets, + compileJavaScripts, + compileStylesheets, updateAssetsVersion )) From 57868c408f1186d48a685ff9ad1640a278a79b3e Mon Sep 17 00:00:00 2001 From: Colin Rotherham Date: Wed, 8 Mar 2023 20:58:38 +0000 Subject: [PATCH 4/4] Move lint task calls to watch task Helps reduce duplication in `gulpfile.mjs` once we start to move directory and file path configs over --- gulpfile.mjs | 16 ++++------------ tasks/gulp/watch.mjs | 15 +++++++++++---- 2 files changed, 15 insertions(+), 16 deletions(-) diff --git a/gulpfile.mjs b/gulpfile.mjs index 504d1c6717..7e30fefd99 100644 --- a/gulpfile.mjs +++ b/gulpfile.mjs @@ -15,10 +15,7 @@ import { npmScriptTask } from './tasks/run.mjs' * Runs JavaScript code quality checks, documentation, compilation */ gulp.task('scripts', gulp.series( - gulp.parallel( - npmScriptTask('lint:js'), - compileJavaScripts - ), + compileJavaScripts, npmScriptTask('build:jsdoc') )) @@ -27,10 +24,7 @@ gulp.task('scripts', gulp.series( * Runs Sass code quality checks, documentation, compilation */ gulp.task('styles', gulp.series( - gulp.parallel( - npmScriptTask('lint:scss'), - compileStylesheets - ), + compileStylesheets, npmScriptTask('build:sassdoc') )) @@ -41,10 +35,8 @@ gulp.task('styles', gulp.series( gulp.task('build:app', gulp.series( clean, copyAssets, - compileJavaScripts, - compileStylesheets, - npmScriptTask('build:jsdoc'), - npmScriptTask('build:sassdoc') + 'scripts', + 'styles' )) /** diff --git a/tasks/gulp/watch.mjs b/tasks/gulp/watch.mjs index 515007f647..ecf66fdb44 100644 --- a/tasks/gulp/watch.mjs +++ b/tasks/gulp/watch.mjs @@ -2,12 +2,13 @@ import gulp from 'gulp' import slash from 'slash' import { paths } from '../../config/index.js' +import { npmScriptTask } from '../run.mjs' /** * Watch task * During development, this task will: - * - run `gulp styles` when `.scss` files change - * - run `gulp scripts` when `.mjs` files change + * - lint and run `gulp styles` when `.scss` files change + * - lint and run `gulp scripts` when `.mjs` files change * * @returns {Promise} Array from file system watcher objects */ @@ -18,12 +19,18 @@ export function watch () { `${slash(paths.app)}/src/**/*.scss`, `${slash(paths.src)}/govuk/**/*.scss`, `!${slash(paths.src)}/govuk/vendor/*` - ], gulp.series('styles')), + ], gulp.parallel( + npmScriptTask('lint:scss'), + 'styles' + )), gulp.watch([ 'jsdoc.config.js', `${slash(paths.src)}/govuk/**/*.mjs` - ], gulp.series('scripts')) + ], gulp.parallel( + npmScriptTask('lint:js'), + 'scripts' + )) ]) }