VFile Reporter in Gitlab Codequality Format

Formatter that transforms VFile error reports into a format suitable for use with GitLab widgets.

And it could be used with linting tools like Remark Lint.

The source code is hosted on GitLab. Although there is an automatic mirror of this repository on GitHub, all bug reports, feature requests, and merge requests should be submitted through GitLab.

Usage

Install vfile and @gitlab-formatters/vfile-reporter-gitlab using your package manager:

npm install --save-dev vfile @gitlab-formatters/vfile-reporter-gitlab

yarn add --dev vfile @gitlab-formatters/vfile-reporter-gitlab

And you can run it in your code using either ESM or CommonJS syntax.

import {VFile} from 'vfile';
import gitlabCodeQualityFormatter from '@gitlab-formatters/vfile-reporter-gitlab';

const one = new VFile({path: 'test/fixture/1.js'});
const two = new VFile({path: 'test/fixture/2.js'});

one.message('Warning!', {line: 2, column: 4});

console.log(gitlabCodeQualityFormatter([one, two]));

Console output would be:

[{"type":"issue","check_name":"Unknown Rule","description":"Warning!","content":{"body":"Error found in Unknown Rule."},"categories":["Style"],"location":{"path":"test/fixture/1.js","lines":{"begin":2,"end":2},"positions":{"begin":{"line":2,"column":4},"end":{"line":2,"column":4}}},"severity":"minor","fingerprint":"079dd4da95f949d9a91749b0130098f1"}]

Usage with Remark Lint

Install remark-cli and @gitlab-formatters/vfile-reporter-gitlab using your package manager:

npm install --save-dev remark-cli @gitlab-formatters/vfile-reporter-gitlab

yarn add --dev remark-cli @gitlab-formatters/vfile-reporter-gitlab

To use in your project, simply run:

npx remark . --report @gitlab-formatters/vfile-reporter-gitlab

For integration with GitLab CI, add the following to your .gitlab-ci.yml:

remark:
  image: node:20.14.0-alpine3.20
  stage: codequality
  script:
    - npm ci
    - npx remark . --report @gitlab-formatters/vfile-reporter-gitlab 2>gl-codequality.json
  artifacts:
    reports:
      codequality: gl-codequality.json

Output Example

Below is a JSON example of how the formatter reports issues.

This particular example outputs a detailed report that goes beyond the minimal fields required by GitLab's code quality widgets.

While GitLab requires only a subset of fields according to the Gitlab Code Quality specification, this formatter implements the full set of fields as outlined in the Code Climate Issue Data Type specification.

This comprehensive implementation enhances the depth of information available and facilitates better issue tracking and resolution.

[
  {
    "type": "issue",
    "check_name": "no-undefined-references",
    "description": "Unexpected reference to undefined definition, expected corresponding definition (``) for a link or escaped opening bracket (`\\[`) for regular text",
    "content": {
      "body": "Error found in no-undefined-references. See https://github.com/remarkjs/remark-lint/tree/main/packages/remark-lint-no-undefined-references#readme for more details."
    },
    "categories": [
      "Style"
    ],
    "location": {
      "path": "README.md",
      "lines": {
        "begin": 16,
        "end": 16
      },
      "positions": {
        "begin": {
          "line": 16,
          "column": 3
        },
        "end": {
          "line": 16,
          "column": 6
        }
      }
    },
    "severity": "minor",
    "fingerprint": "e2a76405959e5bc34b5a22fda2832b16"
  }
]

You can see an example of the widget and how errors are displayed in Merge Request #1.

This merge request includes detailed examples and explanations of the widget's functionality, showcasing how it integrates with GitLab to display code quality issues reported by Remark.

Contributing

If you'd like to contribute to this project, please read through CONTRIBUTING.md file.

Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its causes.

Changelog

Changelog is automatically generated based on semantic-release and conventional commits.

See the CHANGELOG.md file for detailed lists of changes for each version.

License

MIT License. See the License File for more information.

Contacts

If you have any questions or suggestions, feel free to reach me out by:

• Email: [email protected]
• X/Twitter: https://x.com/zavoloklom
• GitHub: https://github.com/zavoloklom