search

suitcss / suit

Style tools for UI components
http://suitcss.github.io/
3.8k stars 225 forks source link

When using glob @imports, `postcss-reporter` incorrectly reports stylelint errors #158

Open rocketspops opened 6 years ago

rocketspops commented 6 years ago

We recently switched to using postcss-easy-import globs for certain files within our CSS manifest, like so:

@import "suitcss-base";
@import "./dependencies/css/partials/fonts/icons.css";
@import "./dependencies/css/partials/fonts/sans-serifs.css";
@import "./dependencies/css/partials/fonts/serifs.css";
@import "./dependencies/css/theme.css";
@import "./dependencies/css/reset.css";
@import "./dependencies/css/fonts.css";

/* Components */

@import "./components/!(_*)/!(*__*).css";

/* Utilities */

@import "suitcss-components-grid";
@import "suitcss-utils";
@import "./dependencies/css/utilities.css";

However, we have now discovered that the postcss-reporter does not accurately report stylelint warnings. Specifically, it will incorrectly associate stylelint errors with only the last file in the list of files expanded by the glob.

For example, if the glob returns this list of files: 

components/chip/_component.css
components/compose/_component.css
components/disclaimer/_component.css
components/icons/_component.css
components/input/_component.css

And components/chip/_component.css contains stylelint errors, postcss-reporter will associate those errors with components/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-reporter associates linting errors with the correct files.

Additionally, if I pass plugins: [stylelint] as an option to postcss-easy-import and disable the lint option, postcss-reporter works as expected.

Any ideas?

Here is example output from a recent build (note: the actual linting errors were found in button.css):

~/Code/uidd-adel (new/card-variant-header *% u=)$ gulp compile:css
[20:21:28] Using gulpfile ~/Code/uidd-adel/gulpfile.js
[20:21:28] Starting 'compile:css'...
/Users/wwhite11/Code/uidd-adel/src/adel.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-base/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/normalize.css/normalize.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-base/lib/base.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/fonts/_icons.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/fonts/_sans-serifs.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/fonts/_serifs.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/theme.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/breakpoints.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/colors.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/fonts.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/units.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/reset.css
/Users/wwhite11/Code/uidd-adel/src/components/button/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/card/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/chip/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/compose/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/disclaimer/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/icons/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/input/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/interstitial/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/link/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/list/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/message/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/modal/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/notification/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/pageheader/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/progress-bar/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/sticker/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/table/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/textarea/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/titlebar/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/tooltip/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/button/button.css
/Users/wwhite11/Code/uidd-adel/src/components/card/card.css
/Users/wwhite11/Code/uidd-adel/src/components/chip/chip.css
/Users/wwhite11/Code/uidd-adel/src/components/compose/compose.css
/Users/wwhite11/Code/uidd-adel/src/components/decorations/decorations.css
/Users/wwhite11/Code/uidd-adel/src/components/disclaimer/disclaimer.css
/Users/wwhite11/Code/uidd-adel/src/components/icons/icons.css
/Users/wwhite11/Code/uidd-adel/src/components/input/input.css
/Users/wwhite11/Code/uidd-adel/src/components/interstitial/interstitial.css
/Users/wwhite11/Code/uidd-adel/src/components/link/link.css
/Users/wwhite11/Code/uidd-adel/src/components/list/list.css
/Users/wwhite11/Code/uidd-adel/src/components/message/message.css
/Users/wwhite11/Code/uidd-adel/src/components/modal/modal.css
/Users/wwhite11/Code/uidd-adel/src/components/notification/notification.css
/Users/wwhite11/Code/uidd-adel/src/components/pageheader/pageheader.css
/Users/wwhite11/Code/uidd-adel/src/components/progress-bar/progress-bar.css
/Users/wwhite11/Code/uidd-adel/src/components/sticker/sticker.css
/Users/wwhite11/Code/uidd-adel/src/components/table/table.css
/Users/wwhite11/Code/uidd-adel/src/components/textarea/textarea.css
/Users/wwhite11/Code/uidd-adel/src/components/titlebar/titlebar.css
/Users/wwhite11/Code/uidd-adel/src/components/tooltip/tooltip.css

src/components/tooltip/tooltip.css
123:7   ⚠  Expected indentation of 4 spaces (indentation) [stylelint]
129:5   ⚠  Expected empty line before rule (rule-empty-line-before) [stylelint]
131:26  ⚠  Unexpected trailing zero(s) (number-no-trailing-zeros) [stylelint]
137:5   ⚠  Expected empty line before comment (comment-empty-line-before) [stylelint]
137:7   ⚠  Expected whitespace after "/*" (comment-whitespace-inside) [stylelint]
137:53  ⚠  Expected whitespace before "*/" (comment-whitespace-inside) [stylelint]
138:5   ⚠  Expected empty line before comment (comment-empty-line-before) [stylelint]
138:7   ⚠  Expected whitespace after "/*" (comment-whitespace-inside) [stylelint]
138:28  ⚠  Expected whitespace before "*/" (comment-whitespace-inside) [stylelint]
140:5   ⚠  Expected indentation of 2 spaces (indentation) [stylelint]
142:3   ⚠  Expected indentation of 0 spaces (indentation) [stylelint]
145:1   ⚠  Expected no more than 1 empty line (max-empty-lines) [stylelint]
220:1   ⚠  Expected no more than 1 empty line (max-empty-lines) [stylelint]

/Users/wwhite11/Code/uidd-adel/src/components/decorations/bullet/_component.css
/Users/wwhite11/Code/uidd-adel/src/components/decorations/rule/_component.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-components-grid/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-components-grid/lib/grid.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-align/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-align/lib/align.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-display/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-display/lib/display.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-layout/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-layout/lib/layout.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-link/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-link/lib/link.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-offset/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-after/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-after/lib/after.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-after/lib/after-sm.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-after/lib/after-md.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-after/lib/after-lg.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-before/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-before/lib/before.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-before/lib/before-sm.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-before/lib/before-md.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-before/lib/before-lg.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-position/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-position/lib/position.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-size/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-size/lib/size.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-size/lib/size-sm.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-size/lib/size-md.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-size/lib/size-lg.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-text/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-text/lib/text.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-flex/index.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-flex/lib/flex.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-flex/lib/flex-sm.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-flex/lib/flex-md.css
/Users/wwhite11/Code/uidd-adel/node_modules/suitcss-utils-flex/lib/flex-lg.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/utilities.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_animations.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_background.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_decorations.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_display.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_sizes.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_text.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_margin.css
/Users/wwhite11/Code/uidd-adel/src/dependencies/css/partials/utilities/_padding.css
[20:21:32] Compiled  src/adel.css
simonsmith commented 6 years ago

@rocketspops Is this happening when you use postcss-easy-import directly or only within the SUIT preprocessor?

rocketspops commented 6 years ago

Hey @simonsmith,

I can get it to work, with caveats, by passing stylelint as a plugin to postcss-easy-import, like so:

.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.css

For some reason, when I take this approach, stylelint no longer ignores the node_modules directory. I also get duplicate logging, as you can see.

rocketspops commented 6 years ago

@simonsmith It would also seem that making the above changes results in stylelint reporting additional, longstanding errors that it didn't catch previously. The two logs I added were done on the same branch w/out any additional CSS changes. However, the latter method returned issues on table, tooltip, and list in addition to button.

I was also able to ignore node_modules like so:

'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 gulp-suitcss.

cc/ @jordanlapointe

rocketspops commented 6 years ago

@simonsmith

Update: I was able to suppress the duplicate stylelint warnings by passing clearAllMessages: true to postcss-reporter: 

  '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 clearAllMessages to remove the non gulp-suitcss messages...

cc/ @jordanlapointe