mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-06-24 17:31:19 -04:00
Add JS modules support & use for GOVUKFrontend
The JS for GOVUKFrontend components is available individually so you can only include what you need: https://github.com/alphagov/govuk-frontend/blob/v2.13.0/docs/installation/installing-with-npm.md#option-2-import-javascript This uses the JS Modules syntax: *[JS module](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) Our JS is delivered as one file so we need to use a bundler to convert the modules to a single file. This adds a build step to transpile all modules into a single file, which is then added to the files combined into the one that get delivered. Rollup is used as the simplest bundler to use for this purpose. It also introduces the least boilerplate JS. Note: the CommonJS plugin is needed as GOV.UK Frontend components are published as UMD modules. In future, this work should let us work on this story dependencies: https://www.pivotaltracker.com/story/show/165380360
This commit is contained in:
19
app/assets/javascripts/modules/all.mjs
Normal file
19
app/assets/javascripts/modules/all.mjs
Normal file
@@ -0,0 +1,19 @@
|
||||
import Header from 'govuk-frontend/components/header/header';
|
||||
|
||||
function initAll (options) {
|
||||
// Set the options to an empty object by default if no options are passed.
|
||||
options = typeof options !== 'undefined' ? options : {}
|
||||
|
||||
// Allow the user to initialise GOV.UK Frontend in only certain sections of the page
|
||||
// Defaults to the entire document if nothing is set.
|
||||
var scope = typeof options.scope !== 'undefined' ? options.scope : document
|
||||
|
||||
// Find first header module to enhance.
|
||||
var $toggleButton = scope.querySelector('[data-module="header"]')
|
||||
new Header($toggleButton).init()
|
||||
}
|
||||
|
||||
export {
|
||||
Header,
|
||||
initAll
|
||||
}
|
||||
Reference in New Issue
Block a user