Skip to content

Add ESLint to a component

Nicholas Valbusa edited this page Nov 23, 2020 · 1 revision
  1. Add required dependencies to package.json (eslint and eslint-config-fliplet) https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/package.json
  2. Add .eslintrc file with relevant settings https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/.eslintrc
  3. Check what files to ignore in .eslintignore https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/.eslintignore
  4. Run eslint from your machine to automatically fix all errors on all files of the repo (eslint . --fix)
  5. Add required globals on each file or globally on .eslintrc https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/package.json
  6. Configure your IDE to automatically fix errors on save

Integrate with GitHub workflow

  1. Add workflow file https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/.github/workflows/main.yml
  2. Amend package.json to link the script https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/package.json#L7
  3. Make sure dependencies in package.json are up to date https://github.com/Fliplet/fliplet-widget-form-builder/blob/af777d2efbe6320d7ec3f79bcc2592a21782c80d/package.json#L20-L21
  4. Make sure the package-lock.json file is committed too

Once set up, each commit will trigger a build which creates annotations for all problems found, e.g. https://github.com/Fliplet/fliplet-widget-form-builder/actions/runs/378678895

Clone this wiki locally