dart-sass
dart-sass copied to clipboard
Support globs on the command line
Latest Sass on both Windows & OSX I get the following error
[email protected] build:css:cdn:
sass src/css/vjs-cdn.scss dist/alt/video-js-cdn.css "--watch" "'src/**/**/*.scss'"
This command works fine as-is in node-sass, but errors out in dart-sass. I would expect only a warning & ignoring the (unused) parameter.
Removing the parameter works well.
Perhaps the project I'm working on is unusual; older codebase but doesn't use grunt/gulp, but uses CLI commands in package.json (which is more of a current trend).
It looks like you want to be able to pass a glob (src/**/**/*.scss) to Dart Sass that it natively handles? That's something we could probably add.
@nex3 would support for globbing become a core, built-in feature of the language or would it be handled via plugins, like Ruby Sass?
It would be part of Dart Sass's command-line API, so... neither.
What about a glob() function that returns a list?
I've dug into this a bit. @nex3 suggested using the Dart API, the JS API, or the Embedded Sass protocol to declare a custom importer that would resolve glob statements. But, looking at the Dart Sass source, I don't see a way for an importer to say, "This @import statement resolves to these 5 files: /path/to/file1.scss, /path/to/file2.scss, etc."
In fact, the Dart Sass source has comments that explicitly instruct importers to throw an exception if an @import statement resolves to more than one file.
I am not fluent in Dart, and would not be surprised at all if I've missed something. But it seems like DartSass will need some changes to relax the "1 @import statement matches 1 file" assumption before globbing can be supported in any way?
I should also add: I don't like globbing and I think the Sass team was right to reject it as a first-party feature years ago. But, folks use globs constantly in the config files for gulp/grunt/webpack/npm, so they have become pervasive.
Also: I realize this issue is about passing input files to the CLI specifically and I'm discussing globs for @import/@use. Because Sass rejected globbed imports years ago, I didn't want to clog the repo with a separate issue for it.
I mentioned this in passing in another thread, but for completeness: if you wanted to support a globbing importer, you'd need to have it return the contents of a synthetic file that contained explicit imports of all the files matching the glob.
Would be very nice to be able to do:
sass "sources/scss/*/main.scss" assets/bare/
And have sources/scss/foo/main.scss compile to assets/bare/foo/main.css
My apologies if this is off the mark as this issue is regarding command line options (and this is far from my area of expertise), but maybe my note below is of use. I have found globbing to work with Dart Sass using the node-sass-glob-importer package. I do so within my webpack setup, not command line, but maybe this is a good sign it can be done without too much additional work?
I'm super keen to move to dart sass, but waiting for this feature before I make the jump. Hopefully it'll be available soon! 🤞
Is this still on the cards? Use case for me is using 11ty, I want a 'style.css' for each folder so, for example site.com/feature1/style.css and site.com/feature2/style.css. I would be great to be able to pass something like this to the Dart CLI:
sass /*/styles.scss:_site/ and have it output the files in the same relative folders
Any update on this issue?
Bump, this would still be very nice to have