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 ec9f8e2f18..41fc1da655 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,10 +54,10 @@ 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 +- 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) @@ -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 compile`** - -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/gulpfile.mjs b/gulpfile.mjs index 286381a9ba..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,34 +24,19 @@ 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') )) /** - * 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, - compileStylesheets, - npmScriptTask('build:jsdoc'), - npmScriptTask('build:sassdoc') -)) - -/** - * Dev task - * Runs a sequence of tasks on start - */ -gulp.task('dev', gulp.series( - 'compile', - watch, - npmScriptTask('serve', ['--workspace', 'app']) + 'scripts', + 'styles' )) /** @@ -74,10 +56,23 @@ gulp.task('build:package', gulp.series( * Prepare dist folder for release */ gulp.task('build:dist', gulp.series( - 'compile', + clean, + copyAssets, + compileJavaScripts, + compileStylesheets, 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..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 compile", "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", 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' + )) ]) } 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)