Add JS and SCSS lint

[alex-ju]

Changes

• set up npm-based linting using standardjs and sass-lint conform reflecting the component conventions
• update JavaScript files to conform with standardjs linting rules
• update SCSS files to conform with sass-lint linting rules
• update Jenkins tasks to run linting

This will align linting tools with the govuk-frontend repo.

Note
scss- rules are still preserved until govuk-lint is retired otherwise CI will fail

IDE Integration

For standardjs there is a list on the project's website: https://standardjs.com/#are-there-text-editor-plugins

For sass-lint there are a couple of extensions, I'll list a couple below:

• Atom: https://atom.io/packages/linter-sass-lint
• Sublime: https://sublimelinter.readthedocs.io/en/stable/
• Visual Studio Code: https://marketplace.visualstudio.com/items?itemName=glen-84.sass-lint
• Other IDEs: https://github.com/sasstools/sass-lint#ide-integration

Related

#124

[andysellick]

Any chance you can provide some details of how to set this up locally? My editor currently has different linting rules, obviously would be good to align.

[alex-ju]

@andysellick:
Standardjs: https://standardjs.com/#are-there-text-editor-plugins

Sass-lint: there are a couple of extensions, I'll list a few below:

• Atom: https://atom.io/packages/linter-sass-lint
• Sublime: https://sublimelinter.readthedocs.io/en/stable/
• Visual Studio Code: https://marketplace.visualstudio.com/items?itemName=glen-84.sass-lint
• Other IDEs: https://github.com/sasstools/sass-lint#ide-integration

[tijmenb]

This is awesome. I've raised alphagov/govuk-rfcs#100 to talk about the entire linting system.