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

Use the modern SASS compiler API #7116

Closed
4 tasks done
KaelWD opened this issue Feb 28, 2022 · 8 comments · Fixed by #17728
Closed
4 tasks done

Use the modern SASS compiler API #7116

KaelWD opened this issue Feb 28, 2022 · 8 comments · Fixed by #17728
Labels
enhancement New feature or request feat: css

Comments

@KaelWD
Copy link
Contributor

KaelWD commented Feb 28, 2022

Clear and concise description of the problem

sass-loader v12.5 added an option to switch to sass.compileAsync instead of the old sass.render, allowing for use of the new Importer interface which supports @use

https://github.com/webpack-contrib/sass-loader#api

Suggested solution

Either switch to compileAsync (breaking change though) or add a similar option as the webpack plugin for people who need the new API.

Alternative

No response

Additional context

Related: #3180

Validations

@bluwy
Copy link
Member

bluwy commented Feb 28, 2022

I think we would be using sass.compileString instead since sass.compile reads from the filesystem. I looked into the types, and it looks like the options for compileString extends from render, so maybe it's not a breaking change if we alternate between compileString and render depending on which API is available.

Related: #6734.

@ygj6 ygj6 mentioned this issue Mar 4, 2022
9 tasks
@ygj6
Copy link
Member

ygj6 commented Mar 4, 2022

FYI, I made a simple attempt to support SASS modern API #7170

@pvanagtmaal

This comment was marked as spam.

@danieka
Copy link

danieka commented Jan 26, 2024

@ygj @KaelWD @bluwy @sapphi-red You might already have seen this, but sass/sass#3247 was recently resolved and it seems like the speed improvements could be significant. Just as a friendly FYI 😄

@john-easci
Copy link

@sapphi-red

Wanted to ref a non-breaking change for this ( #14689 ).

If we allow both legacy and modern modes with a super-simple flag in the config, then it should be a point fix which would be great to get earlier, since it is both a performance and a functionality issue.

@sapphi-red sapphi-red removed this from the 6.0 milestone May 7, 2024
@sapphi-red
Copy link
Member

Definitely, I forgot why I put the label.

@sapphi-red
Copy link
Member

If I understand correctly, the blockers on upstream are all gone and just needs someone to implement it.

@Mister-Hope
Copy link

If I understand correctly, the blockers on upstream are all gone and just needs someone to implement it.

Yes, and in some cases, this should be a fix instead of improvements, because the current api is already deprecated, and some new features could not be configured.

For example, sass/dart-sass#2276 (comment)

veaba added a commit to veaba/formily that referenced this issue Jul 30, 2024
…77.7 +

see: 
https://sass-lang.com/documentation/breaking-changes/mixed-decls/#example-mixed-declarations-opt-in-scss

warning report:

```shell
Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in `& {}`.

More info: https://sass-lang.com/d/mixed-decls

    ╷
47  │ ┌           &.#{$css-prefix}formily-item-warning-help {
48  │ │             color: $form-warning-color;
49  │ │           }
    │ └─── nested rule
... │
54  │             top: 100%;
    │             ^^^^^^^^^ declaration
    ╵
    stdin 54:11  root stylesheet
```

## issues
- sass/dart-sass#2280
- vitejs/vite#7116
@github-actions github-actions bot locked and limited conversation to collaborators Aug 14, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
enhancement New feature or request feat: css
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants