VSCode warning on @use in scss file

问题

I have an scss file that looks like this

@use "colors";

.content {
    color: colors.$text;
}

This compiles fine with my current version of sass (I'm using dart-sass version v1.23.7)

But VSCode shows 3 problems in the problems panel which looks a little like this

It seems like I need to do something to update the underlying version of scss used but I can't for the life of me work out where this setting is?

The details of one of these errors is:

{
    "resource": "Untitled-1",
    "owner": "_generated_diagnostic_collection_name_#0",
    "code": "css-ruleorselectorexpected",
    "severity": 8,
    "message": "at-rule or selector expected",
    "source": "scss",
    "startLineNumber": 5,
    "startColumn": 1,
    "endLineNumber": 5,
    "endColumn": 2
}

回答1:

It looks like this extension scss modules will fix that problem until the new syntax is incorporated into vscode.

Track https://github.com/microsoft/vscode/issues/81943

Update: v1.41 is adding support for scss modules. See https://github.com/microsoft/vscode-docs/blob/vnext/release-notes/v1_41.md#sass-modules-support

Sass Modules support

Sass recently introduced a new module system.

We have added syntax highlighting support, as well as language feature support for SASS Modules in SCSS files. The language features include:

Auto completion of @use and @forward

Path completion for @use and @forward path

Auto completion of SASS built-in modules such as sass:math and sass:color

Document Link for @use and @forward import paths

来源：https://stackoverflow.com/questions/58974574/vscode-warning-on-use-in-scss-file

标签

visual-studio-code

Sass