css - Visual studio Code using Sass is not compiling - Stack Overflow

I tried to compile sass using Visual Studio with the “live sass compiler” extension, I'm a bit confused about how to set Sass with CSS. kindly check to see if this correct setting compares with the attachment image.

    "liveSassCompile.settings.includeItems": \[   \],
    "liveSassCompile.settings.watchOnLaunch": true,
    "liveSassCompile.settings.useNewCompiler": true,
    "liveSassCompile.settings.showOutputWindowOn": "Warning",
    "liveSassCompile.settings.formats": \[
       
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": null,
            "savePathReplacementPairs": null
        },
        {
            "format": "compressed",
            "extensionName": ".css",
            "savePath": null,
            "savePathReplacementPairs": null,
            "generateMap": false
        }
    \],
    "liveSassCompile.settings.excludeList": \[
        "/**/node_modules/**",
        "/.vscode/**"
    \]
}

I’ve attached a file screenshot, but I need your help to see if this setting is correct for compiler sass.

I tried to compile sass using Visual Studio with the “live sass compiler” extension, I'm a bit confused about how to set Sass with CSS. kindly check to see if this correct setting compares with the attachment image.

    "liveSassCompile.settings.includeItems": \[   \],
    "liveSassCompile.settings.watchOnLaunch": true,
    "liveSassCompile.settings.useNewCompiler": true,
    "liveSassCompile.settings.showOutputWindowOn": "Warning",
    "liveSassCompile.settings.formats": \[
       
        {
            "format": "expanded",
            "extensionName": ".css",
            "savePath": null,
            "savePathReplacementPairs": null
        },
        {
            "format": "compressed",
            "extensionName": ".css",
            "savePath": null,
            "savePathReplacementPairs": null,
            "generateMap": false
        }
    \],
    "liveSassCompile.settings.excludeList": \[
        "/**/node_modules/**",
        "/.vscode/**"
    \]
}

I’ve attached a file screenshot, but I need your help to see if this setting is correct for compiler sass.

• css
• visual-studio-code
• sass

Share Improve this question Follow edited Feb 3 at 16:52 James Z 12.3k1010 gold badges2727 silver badges4747 bronze badges asked Feb 3 at 15:08 user1953826user1953826 4122 silver badges88 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

There's one error that will cause you're files to override each other

The compiler would save the expanded and compressed version with a ".css" extension - so whichever saved first would be overwrote by the last

I'd suggest you use the ".min.css" for the compressed version