Namespace nunjucks and components #1458

aliuk2012 · 2019-06-17T10:34:32Z

To namespace GOV.UK Frontend components, a new govuk directory has been added to the package and src directories. This means that users should now be able to run GOV.UK Frontend along side their own departmental frontend without any conflicts. There was no need to add govuk directory to dist or public as they would only contain compiled code and be used differently from package and src

Changes to `src` directory

Before

src
├── assets
├── components
├── core
├── helpers
├── objects
├── overrides
├── settings
├── tools
├── utilities
├── vendor
├── README.md
├── all-ie8.scss
├── all.js
├── all.scss
├── all.test.js
├── common.js
├── template.njk
└── template.test.js

After

src
└── govuk
    ├── assets
    ├── components
    ├── core
    ├── helpers
    ├── objects
    ├── overrides
    ├── settings
    ├── tools
    ├── utilities
    ├── vendor
    ├── README.md
    ├── all-ie8.scss
    ├── all.js
    ├── all.scss
    ├── all.test.js
    ├── common.js
    ├── template.njk
    └── template.test.js

Changes to `package`

Before

package
├── assets
├── components
├── core
├── helpers
├── objects
├── overrides
├── settings
├── tools
├── utilities
├── vendor
├── README.md
├── all-ie8.scss
├── all.js
├── all.scss
├── common.js
├── govuk-prototype-kit.config.json
├── package.json
└── template.njk

After

package
├── govuk
│   ├── assets
│   ├── components
│   ├── core
│   ├── helpers
│   ├── objects
│   ├── overrides
│   ├── settings
│   ├── tools
│   ├── utilities
│   ├── vendor
│   ├── all-ie8.scss
│   ├── all.js
│   ├── all.scss
│   ├── common.js
│   └── template.njk
├── README.md
├── govuk-prototype-kit.config.json
└── package.json

Tested:

npm start still works
npm run pre-release still works
npm run release-to-branch still works
check no changes to dist and public directories.

Details

app/views/macros/loadComponentTemplate.njk

hannalaakso

Looks great 🌮 Left a couple of non-blocking comments.

There are quite a few places in the documentation where we need to reflect this change (do a search for "src/" in docs/ to see them).

tasks/gulp/compile-assets.js

aliuk2012 · 2019-06-19T11:36:34Z

I'll do a separate PR for docs and assets as this PR is already a large one with all the renames

36degrees · 2019-06-19T12:55:42Z

Generally looking really good. The before and after directory structures in the first commit message use different depths (one includes all files; the other just includes the top-level folder names) – this makes it quite difficult to see the difference. Could we re-word the commit message using consistent directory structures?

Due to a known Github bug (isaacs/github#900) you can’t view previous history after using `git mv`. To view the previous history of files in src/govuk, use git blame. The URL format is repo-name/blame/branch/dir/file. For example https://github.com/alphagov/govuk-frontend/blame/master/src/README.md Description of work: This is a start to namespacing our code under govuk and has been accepted by the community. Directory structure before the commit: src ├── assets ├── components ├── core ├── helpers ├── objects ├── overrides ├── settings ├── tools ├── utilities ├── vendor ├── README.md ├── all-ie8.scss ├── all.js ├── all.scss ├── all.test.js ├── common.js ├── template.njk └── template.test.js Directory structure after this commit: src └── govuk ├── assets ├── components ├── core ├── helpers ├── objects ├── overrides ├── settings ├── tools ├── utilities ├── vendor ├── README.md ├── all-ie8.scss ├── all.js ├── all.scss ├── all.test.js ├── common.js ├── template.njk └── template.test.js See proposal for more detail https://github.com/alphagov/govuk-design-system-architecture/blob/master/proposals/005-namespace-govuk-frontend-nunjucks-sass-using-a-nested-folder-structure.md Co-authored-by: Hanna Laakso <hanna.laakso@digital.cabinet-office.gov.uk>

Co-authored-by: Hanna Laakso <hanna.laakso@digital.cabinet-office.gov.uk>

Before: package ├── assets ├── components ├── core ├── helpers ├── objects ├── overrides ├── settings ├── tools ├── utilities ├── vendor ├── README.md ├── all-ie8.scss ├── all.js ├── all.scss ├── common.js ├── govuk-prototype-kit.config.json ├── package.json └── template.njk After: package ├── govuk │ ├── assets │ ├── components │ ├── core │ ├── helpers │ ├── objects │ ├── overrides │ ├── settings │ ├── tools │ ├── utilities │ ├── vendor │ ├── all-ie8.scss │ ├── all.js │ ├── all.scss │ ├── common.js │ └── template.njk ├── README.md ├── govuk-prototype-kit.config.json └── package.json See proposal for more detail https://github.com/alphagov/govuk-design-system-architecture/blob/master/proposals/005-namespace-govuk-frontend-nunjucks-sass-using-a-nested-folder-structure.md

This commit fixes the issues identified while trying to run `npm run build:dist`. Current and desired directory structure: dist ├── assets │ ├── fonts │ └── images ├── VERSION.txt ├── govuk-frontend-2.13.0.min.css ├── govuk-frontend-2.13.0.min.js └── govuk-frontend-ie8-2.13.0.min.css See proposal for more detail https://github.com/alphagov/govuk-design-system-architecture/blob/master/proposals/005-namespace-govuk-frontend-nunjucks-sass-using-a-nested-folder-structure.md

Some of the changes made before meant that js files were being compiled and placed in a `govuk` directory. This meant that the browser could not find the js files when viewing the page. Current & desired folder structure for `public` when serving up the review app: public ├── components │ ├── accordion │ ├── button │ ├── character-count │ ├── checkboxes │ ├── details │ ├── error-summary │ ├── header │ ├── radios │ └── tabs ├── vendor │ └── polyfills ├── all.js ├── app-ie8.css ├── app-legacy-ie8.css ├── app-legacy.css ├── app.css └── common.js

hannalaakso

Looks good to me 🙌 Need another person to approve who didn't do work on this

If you try to run this prototype now it doesn’t work, because the version of GOV.UK Frontend that you get if running ```shell npm install govuk-frontend@^3.0.0 ``` introduces a breaking change[1] that came with version 3.0.0 of GOV.UK Frontend. This repo was using a pre-release version of 3.0.0 in order to get the new focus styles. However when it was updated to 3.0.0 stable it wasn’t also updated[2] to respect the folder structure changes that came with 3.0.0. This commit updates the paths to the macros to point to the right place. 1. alphagov/govuk-frontend#1458 2. alphagov@22d7f9c

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 10:34 Inactive

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 10:41 Inactive

aliuk2012 force-pushed the al/namespace branch from 0145ce3 to 7be454a Compare June 17, 2019 12:22

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 12:23 Inactive

aliuk2012 force-pushed the al/namespace branch from 7be454a to 3042ed9 Compare June 17, 2019 12:25

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 12:25 Inactive

aliuk2012 force-pushed the al/namespace branch from 3042ed9 to 541d683 Compare June 17, 2019 12:27

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 12:27 Inactive

aliuk2012 force-pushed the al/namespace branch from 541d683 to f0055f8 Compare June 17, 2019 12:31

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 12:31 Inactive

aliuk2012 force-pushed the al/namespace branch from f0055f8 to 803450c Compare June 17, 2019 12:34

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 12:34 Inactive

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 17, 2019 14:10 Inactive

NickColley reviewed Jun 17, 2019

View reviewed changes

app/views/macros/loadComponentTemplate.njk Outdated Show resolved Hide resolved

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 18, 2019 13:40 Inactive

aliuk2012 force-pushed the al/namespace branch from d235be6 to 6e86daf Compare June 18, 2019 13:44

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 18, 2019 13:44 Inactive

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 18, 2019 16:10 Inactive

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 08:24 Inactive

aliuk2012 force-pushed the al/namespace branch from 6828b9f to 2447851 Compare June 19, 2019 08:45

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 08:45 Inactive

aliuk2012 force-pushed the al/namespace branch from 2447851 to ff99ca1 Compare June 19, 2019 08:56

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 08:56 Inactive

aliuk2012 force-pushed the al/namespace branch from ff99ca1 to ad697a1 Compare June 19, 2019 09:34

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 09:34 Inactive

aliuk2012 force-pushed the al/namespace branch from ad697a1 to ced36fc Compare June 19, 2019 09:42

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 09:42 Inactive

aliuk2012 force-pushed the al/namespace branch from ced36fc to 58458ff Compare June 19, 2019 10:02

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 10:02 Inactive

aliuk2012 force-pushed the al/namespace branch from 58458ff to f1f0361 Compare June 19, 2019 10:20

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 10:20 Inactive

aliuk2012 marked this pull request as ready for review June 19, 2019 10:20

hannalaakso reviewed Jun 19, 2019

View reviewed changes

tasks/gulp/compile-assets.js Outdated Show resolved Hide resolved

tasks/gulp/compile-assets.js Outdated Show resolved Hide resolved

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-1458 June 19, 2019 11:06 Inactive

aliuk2012 added this to the v3.0.0 milestone Jun 19, 2019

aliuk2012 mentioned this pull request Jun 19, 2019

[As part of release] Updates the docs to point to the right files #1466

Merged

aliuk2012 and others added 6 commits June 19, 2019 16:05

update Standard ignore to exclude src/govuk/vendor

6cfc923

Fix tests by updating requires relative directory path

d8d9160

Co-authored-by: Hanna Laakso <hanna.laakso@digital.cabinet-office.gov.uk>

aliuk2012 force-pushed the al/namespace branch from b883c5d to a1eec4d Compare June 19, 2019 15:05

govuk-design-system-ci deployed to govuk-frontend-review-pr-1458 June 19, 2019 15:05 View deployment

hannalaakso approved these changes Jun 20, 2019

View reviewed changes

NickColley approved these changes Jun 21, 2019

View reviewed changes

aliuk2012 merged commit 063cd8e into master Jun 21, 2019

NickColley deleted the al/namespace branch June 21, 2019 11:52

hannalaakso mentioned this pull request Jul 15, 2019

Update with edited version of v3.0.0 (unreleased) changelog #1492

Merged

quis mentioned this pull request Nov 14, 2019

Update macro paths to newest GOV.UK frontend alphagov/focus-state-prototype#10

Open

snyk-bot mentioned this pull request Feb 25, 2020

[Snyk] Upgrade govuk-frontend from 3.0.0 to 3.5.0 ministryofjustice/offender-categorisation#400

Closed

colinrotherham mentioned this pull request Feb 15, 2023

Enhance the structure of our repository #3291

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Namespace nunjucks and components #1458

Namespace nunjucks and components #1458

aliuk2012 commented Jun 17, 2019 •

edited

Loading

hannalaakso left a comment

aliuk2012 commented Jun 19, 2019

36degrees commented Jun 19, 2019

hannalaakso left a comment

Namespace nunjucks and components #1458

Namespace nunjucks and components #1458

Conversation

aliuk2012 commented Jun 17, 2019 • edited Loading

Changes to src directory

Changes to package

Tested:

hannalaakso left a comment

Choose a reason for hiding this comment

aliuk2012 commented Jun 19, 2019

36degrees commented Jun 19, 2019

hannalaakso left a comment

Choose a reason for hiding this comment

aliuk2012 commented Jun 17, 2019 •

edited

Loading

Changes to `src` directory

Changes to `package`