Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SCSS support? #135

Open
ronilaukkarinen opened this issue Apr 6, 2021 · 5 comments
Open

SCSS support? #135

ronilaukkarinen opened this issue Apr 6, 2021 · 5 comments
Labels
docs Documentation

Comments

@ronilaukkarinen
Copy link

I'd like to lint .scss files.

doiuse sass/variables/_spacings.scss 

Produces:

{ CssSyntaxError: /Users/rolle/Projects/airdev/content/themes/air-light/sass/variables/sass/variables/_spacings.scss:3:1: Unknown word
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser
    at Input.error (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/input.js:112:16)
    at Parser.unknownWord (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/parser.js:518:22)
    at Parser.decl (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/parser.js:201:16)
    at Parser.other (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/parser.js:115:18)
    at Parser.parse (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/parser.js:59:16)
    at parse (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/parse.js:11:12)
    at new LazyResult (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/lazy-result.js:122:16)
    at Processor.process (/usr/local/lib/node_modules/doiuse/node_modules/postcss/lib/processor.js:33:12)
    at Transform.write [as _transform] (/usr/local/lib/node_modules/doiuse/stream.js:60:17)
    at Transform._read (/usr/local/lib/node_modules/doiuse/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:177:10)
  name: 'CssSyntaxError',
  reason: 'Unknown word',
  file:
   '/Users/rolle/Projects/airdev/content/themes/air-light/sass/variables/sass/variables/_spacings.scss',
  line: 3,
  column: 1,
  input:
   { line: 3,
     column: 6,
     source:
      '// CSS Variables for responsive paddings and margins\n:root {\n  // Paddings\n  --padding-container-horizontal: 2rem;\n  --padding-container-vertical: 6.4rem;\n  --padding-site-header-vertical: 2rem;\n  --padding-block: 8rem;\n\n  // Margins\n  --margin-between-text-elements: 4rem;\n\n  // Mid-sized screens\n  @media (max-width: $width-grid-base + 150px) {\n    --padding-container-horizontal: 2rem;\n  }',
     url:
      'file:///Users/rolle/Projects/airdev/content/themes/air-light/sass/variables/_spacings.scss',
     file:
      '/Users/rolle/Projects/airdev/content/themes/air-light/sass/variables/_spacings.scss' } }

I never work with outputted CSS files. It would be amazing to be able to use vscode plugin and see the browser support directly on editor linter OR even implement this to a gulp task.

@ronilaukkarinen
Copy link
Author

Oh, never mind, that plugin supports SCSS out of the box... closing this.

Screen-Shot-2021-04-06-15-11-10 48

@ronilaukkarinen
Copy link
Author

Got it running on my editor, yes, but let's say I want doiuse to be part of our travis workflow. What command do I use to enable SCSS support in doiuse?

@WebMechanic
Copy link

it's reporting
You tried to parse SCSS with the standard CSS parser; try again with the postcss-scss parser

I installed said postcss-scss parser, but doiuse won't utilize it. Is there some config option?
It' sad we can't lint .scss files :(

@codethief
Copy link

I'd be very interested in this as well!

@clshortfuse
Copy link
Collaborator

clshortfuse commented Jul 3, 2023

It's not exactly a core feature I think we should support, since we'd be overcomplicating the scope of the project by drawing in more dependencies.

Generally, you'd use postcss with a preprocessor either at the command line level before piping or with stylelint (which also uses postcss). Personally, I don't use the cli much because I have the errors built into the IDE.

That said, we should probably have a guide somewhere at minimum. Next, we should be probably add some tests to ensure you can pipe SCSS over.

@clshortfuse clshortfuse added the docs Documentation label Oct 4, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
docs Documentation
Projects
None yet
Development

No branches or pull requests

4 participants