Skip to content
On this page

Linting

On this page

Primer ViewComponents offers a suite of linters to make writing UI more consistent. We provide custom linters for erb-lint and cops for rubocop.

Setup

rubocop

To use our custom cops, you have to inherit our gem configuration in .rubocop.yml:

inherit_gem:
primer_view_components: lib/rubocop/config/default.yml

You can also modify that configuration enabling/disabling the cops you want:

Primer/SystemArgumentInsteadOfClass:
Enabled: false

erb-lint

To get access to our ERB linters, create a .erb-linters/primer.rb file with:

require "primer/view_components/linters"

Then, you can enable them in .erb-lint.yml. E.g.:

linters:
ButtonComponentMigrationCounter:
enabled: true

If you also want to add our cops when linting ERB, you can modify your .erb-lint.yml to have:

linters:
Rubocop:
enabled: true
rubocop_config:
inherit_gem:
primer_view_components: lib/rubocop/config/default.yml