govuk-frontend
govuk-frontend copied to clipboard
Decide on an approach to gulp-free task scripting
What
Investigate approaches to scripting our task functions.
We're currently replacing gulp tasks with vanilla functions, but we're still running these functions via wrapping Gulp tasks. This means we have several task files which export these new functions, but no scripting for actually collecting and running a set of those tasks together.
Some initial ideas include:
- Making heavy use of
npm
scripts, but keeping them simple by abstracting them into external files - Having a large collection of "scripting" files that each run a set of tasks
- Having one scripting controller file that takes an argument and runs the correct set of tasks
Why
We have made the decision to move away from Gulp and write our own build scripts.
Assumptions
- devs are likely going to naturally interact with the build tools via
npm
(ie, "standard" commands like:npm start
,npm test
, etc)
Timebox
2 days We should review progress after this period of time has elapsed, even if the spike has not been 'completed'
Who is working on this?
Spike lead:
Spike buddy:
Questions to answer
- [ ] What are other projects who've moved from Gulp to vanilla/NPM scripts doing? (eg: The Prototype Kit team!, Bootstrap)
- [ ] Should we differentiate between tasks that do one thing and tasks that run several subtasks?
- [ ] Should we have lots of individual task scripting files that each execute a series of functions, or one file that can be passed an argument and decide which functions to run? Or something else?
- [ ] Do we need to consider streaming?
Done when
You may find it helpful to refer to our expected outcomes of spikes.
- [ ] Questions have been answered or we have a clearer idea of how to get to our goal
- [ ] Findings have been reviewed and agreed with at least one other person
- [ ] Findings have been shared, e.g: via a write-up on the ticket, at a show & tell or team meeting
Prototype Kit Gulp removal work is here: https://github.com/alphagov/govuk-prototype-kit/pull/1324
I've added some more analysis to my Gulp Stuff™ Spreadsheet, looking at our NPM scripts: https://docs.google.com/spreadsheets/d/1aprdKVIx6FzBtX9ohWx6LR8p5XH3s2PNq1tev1ZwxkY/edit#gid=77403370
There's a sheet comparing the tasks our npm scripts actually perform under the hood, and a deeper dive into the SCSS and JS compilation tasks because they're quite convoluted.
Some takeaways:
-
npm run heroku
andnpm start
are very similar, except the heroku script doesn't clean thepublic
folder, and doesn't watch file changes -
build-release
,publish-release
andpre-release
all run.sh
scripts, so there is precedence for doing things that way (but that relies on devs being comfortable with bash scripts - most FE devs are more likely to be comfortable with JS?) -
npm run build-release
runscheck-nvmrc
3 times, CSS compilation twice and JS compilation three times. - Stepping through our tasks to audit them is a pain of looking up nested tasks