CODEWITHSUNDEEP
cssjenkinssasscheckstylestylelint
roNn23
roNn23

Reputation: 1652

How to generate a checkstyle.xml for Jenkins with stylelint?

I wonder how to generate a checkstyle.xml for Jenkins with stylelint. Searched around the web and sadly found just stylelint-checkstyle-formatter, but only the following "instruction":

Simply read the stylelint documentation about using formatters and follow those instructions.

Sadly again, I found nothing in the documentation...

Upvotes: 2

Views: 1398

Answers (2)

zooglash
zooglash

Reputation: 1775

I got it to work via CLI by installing the stylelint-checkstyle-formatter plugin and then passing it to stylelint using the --custom-formatter option:

npm install stylelint-checkstyle-formatter --save-dev
stylelint --custom-formatter ./node_modules/stylelint-checkstyle-formatter ....

Upvotes: 1

roNn23
roNn23

Reputation: 1652

I've finally found a way (with gulp) and want it to share on StackOverflow.

First install the following dependencies:

yarn add -D stylelint gulp-stylelint stylelint-checkstyle-formatter stylelint-scss stylelint-config-recommended-scss

Then use the following gulp task:

gulp.task("scss-lint", function() {
    const gulpStylelint = require('gulp-stylelint');
    const stylelintCheckstyleFormatter = require('stylelint-checkstyle-formatter');

    return gulp
        .src('src/**/*.scss')
        .pipe(gulpStylelint({
            reportOutputDir: 'build/reports/scss-checkstyle',
            reporters: [
                {formatter: 'verbose', console: true},
                {formatter: stylelintCheckstyleFormatter, save: 'checkstyle.xml'},
            ],
        }));
});

And finally my .stylelint:

{
    "extends": "stylelint-config-recommended-scss",
    "defaultSeverity": "warning",
    "formatter": "stylelint-checkstyle-formatter",
    "plugins": [
        "stylelint-scss"
    ],
        "rules": {
        "indentation": 4,
            "color-hex-length": null,
            "shorthand-property-no-redundant-values": null,
            "no-missing-end-of-source-newline": null,
            "declaration-empty-line-before": null,
            "at-rule-empty-line-before": null,
            "selector-type-no-unknown": [
            true,
            {
                "ignore": ["custom-elements"],
                "ignoreTypes": ["tooltip"]
            }
        ]
    }
}

Upvotes: 3

Related Questions