When using glob @imports, postcss-reporter incorrectly reports stylelint errors
#158
Labels
Comments
|
@rocketspops Is this happening when you use postcss-easy-import directly or only within the SUIT preprocessor? |
|
Hey @simonsmith, I can get it to work, with caveats, by passing .pipe(suitcss, {
lint: false,
encapsulate: true,
use: [
'postcss-nesting',
'postcss-remove-root'
],
'postcss-calc': { precision: 3 },
'postcss-custom-properties': { preserve: 'computed' },
'postcss-easy-import': {
prefix: '_',
plugins: [
stylelint({
extends: ['stylelint-config-suitcss'],
rules: {
'at-rule-empty-line-before': null,
'function-calc-no-unspaced-operator': null,
'function-parentheses-space-inside': 'never-single-line',
'no-missing-end-of-source-newline': null
}
})
]
}
})Doing so results in this output: ~/Code/uidd-adel (new/card-variant-header * u=)$ gulp compile:css
[07:52:47] Using gulpfile ~/Code/uidd-adel/gulpfile.js
[07:52:47] Starting 'compile:css'...
node_modules/normalize.css/normalize.css
14:3 ⚠ Unexpected vendor-prefix "-ms-text-size-adjust" (property-no-vendor-prefix) [stylelint]
15:3 ⚠ Unexpected vendor-prefix "-webkit-text-size-adjust" (property-no-vendor-prefix) [stylelint]
54:8 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
97:3 ⚠ Unexpected vendor-prefix "-webkit-text-decoration-skip" (property-no-vendor-prefix) [stylelint]
220:1 ⚠ Unexpected composition (suitcss/selector-root-no-composition) [stylelint]
245:9 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
255:10 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
269:3 ⚠ Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix) [stylelint]
355:3 ⚠ Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix) [stylelint]
365:3 ⚠ Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix) [stylelint]
374:3 ⚠ Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix) [stylelint]
src/components/button/_component.css
110:3 ⚠ Expected empty line before rule (rule-empty-line-before) [stylelint]
112:14 ⚠ Expected double quotes (string-quotes) [stylelint]
115:5 ⚠ Expected left to come before top (order/properties-alphabetical-order) [stylelint]
116:5 ⚠ Expected bottom to come before left (order/properties-alphabetical-order) [stylelint]
122:7 ⚠ Expected indentation of 4 spaces (indentation) [stylelint]
128:5 ⚠ Expected empty line before rule (rule-empty-line-before) [stylelint]
130:26 ⚠ Unexpected trailing zero(s) (number-no-trailing-zeros) [stylelint]
136:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
136:7 ⚠ Expected whitespace after "/*" (comment-whitespace-inside) [stylelint]
136:53 ⚠ Expected whitespace before "*/" (comment-whitespace-inside) [stylelint]
137:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
137:7 ⚠ Expected whitespace after "/*" (comment-whitespace-inside) [stylelint]
137:28 ⚠ Expected whitespace before "*/" (comment-whitespace-inside) [stylelint]
139:5 ⚠ Expected indentation of 2 spaces (indentation) [stylelint]
141:3 ⚠ Expected indentation of 0 spaces (indentation) [stylelint]
144:1 ⚠ Expected no more than 1 empty line (max-empty-lines) [stylelint]
219:1 ⚠ Expected no more than 1 empty line (max-empty-lines) [stylelint]
src/components/list/_component.css
74:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
144:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
177:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
src/components/tooltip/_component.css
112:4 ⚠ Unexpected whitespace at end of line (no-eol-whitespace) [stylelint]
src/components/table/_component.css
52:7 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
54:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
56:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
257:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
303:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
339:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
341:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
462:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
484:7 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
507:7 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
601:5 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
617:3 ⚠ Expected empty line before comment (comment-empty-line-before) [stylelint]
[07:52:50] gulp-suitcss :
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:54:8: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:245:9: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:255:10: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:14:3: Unexpected vendor-prefix "-ms-text-size-adjust" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:15:3: Unexpected vendor-prefix "-webkit-text-size-adjust" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:97:3: Unexpected vendor-prefix "-webkit-text-decoration-skip" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:269:3: Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:355:3: Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:365:3: Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:374:3: Unexpected vendor-prefix "-webkit-appearance" (property-no-vendor-prefix)
stylelint: /Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css:220:1: Unexpected composition (suitcss/selector-root-no-composition)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:136:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:137:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:136:7: Expected whitespace after "/*" (comment-whitespace-inside)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:136:53: Expected whitespace before "*/" (comment-whitespace-inside)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:137:7: Expected whitespace after "/*" (comment-whitespace-inside)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:137:28: Expected whitespace before "*/" (comment-whitespace-inside)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:111:599: Expected indentation of 0 spaces (indentation)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:122:7: Expected indentation of 4 spaces (indentation)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:139:5: Expected indentation of 2 spaces (indentation)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:134:645: Expected no more than 1 empty line (max-empty-lines)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:134:2429: Expected no more than 1 empty line (max-empty-lines)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:130:26: Unexpected trailing zero(s) (number-no-trailing-zeros)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:115:5: Expected left to come before top (order/properties-alphabetical-order)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:116:5: Expected bottom to come before left (order/properties-alphabetical-order)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:110:3: Expected empty line before rule (rule-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:128:5: Expected empty line before rule (rule-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/button/_component.css:134:113: Expected double quotes (string-quotes)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/list/_component.css:74:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/list/_component.css:144:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/list/_component.css:177:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/tooltip/_component.css:93:1060: Unexpected whitespace at end of line (no-eol-whitespace)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:52:7: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:54:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:56:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:257:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:303:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:339:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:341:3: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:462:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:484:7: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:507:7: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:601:5: Expected empty line before comment (comment-empty-line-before)
stylelint: /Users/wwhite11/Code/uidd-adel/src/components/table/_component.css:617:3: Expected empty line before comment (comment-empty-line-before)
[07:52:51] Compiled src/adel.cssFor some reason, when I take this approach, |
|
@simonsmith It would also seem that making the above changes results in I was also able to ignore 'postcss-easy-import': {
prefix: '_',
plugins: [
stylelint({
ignoreFiles: 'node_modules/**/*.css',
extends: ['stylelint-config-suitcss'],
rules: {
'at-rule-empty-line-before': null,
'function-calc-no-unspaced-operator': null,
'function-parentheses-space-inside': 'never-single-line',
'no-missing-end-of-source-newline': null
}
})
]
}This solution is workable for now, but it'd be great to figure out away to suppress the logs from cc/ @jordanlapointe |
|
Update: I was able to suppress the duplicate 'postcss-easy-import': {
prefix: '_',
plugins: [
stylelint({
ignoreFiles: 'node_modules/**/*.css',
extends: ['stylelint-config-suitcss'],
rules: {
'at-rule-empty-line-before': null,
'function-calc-no-unspaced-operator': null,
'function-parentheses-space-inside': 'never-single-line',
'no-missing-end-of-source-newline': null
}
})
]
},
'postcss-reporter': {
clearAllMessages: true
}Admittedly, not totally sure why this worked, since I expected cc/ @jordanlapointe |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
We recently switched to using
postcss-easy-importglobs for certain files within our CSS manifest, like so:However, we have now discovered that the
postcss-reporterdoes not accurately reportstylelintwarnings. Specifically, it will incorrectly associatestylelinterrors with only the last file in the list of files expanded by the glob.For example, if the glob returns this list of files:
And
components/chip/_component.csscontainsstylelinterrors,postcss-reporterwill associate those errors withcomponents/input/_component.css.Effectively, this leaves us guessing as to the true source of any linting issues within our css. If we remove the glob and instead list all of our component CSS files manually,
postcss-reporterassociates linting errors with the correct files.Additionally, if I pass
plugins: [stylelint]as an option topostcss-easy-importand disable thelintoption,postcss-reporterworks as expected.Any ideas?
Here is example output from a recent build (note: the actual linting errors were found in
button.css):The text was updated successfully, but these errors were encountered: