Files appear to have changes, although no visible changes are seen + Compile on save.

[razvan000]

Hello and thanks for maintaining this project.

I have two issues for which I can't find a solution:

1. CSS bundles (both minified and only bundled versions) get regenerated - can be seen in the Git Changes tab - everytime I am switching from a branch to another, even if there are no changes in the scss files that make them up. I figured it might be a CLRF thing, but I can't find any evidence to that, and neither a solution. As it is quite annoying, having to revert the files everytime I am on a new branch, any help with this would be appreciated.

2. The extension's context menu is not available when right clicking any of the files in my project and neither can I see any tasks in the Task Runner Explorer. How can I enable compile on save?

Installed product versions

• Visual Studio: [2022]
• This extension: [1.14.9.1]

Thanks in advance.

[failwyn]

Can you try upgrading the extension to the latest version? If that doesn’t fix it, can you provide the scss file and your compilerconfig so that I can try to replicate the issue?

// I’m planning a new release next week if I can replicate this issue I can hopefully squeeze this in

[razvan000]

According to VS2022 I am already on the latest stable version (1.14.9.1). I tried reinstalling the extension but the issue persists. As for the files, I am able to provide compilerconfig.json, but the target scss file is merely a bunch of imports.

compilerconfig.json:

[
  {
    "inputFile": "wwwroot/css/Styles/homepage.scss",
    "outputFile": "wwwroot/css/Styles/homepage.css",
    "minify": {
      "enabled": true
    }
  }
]

mockup homepage.scss:

@charset "utf-8";
@import "libs/first-file";
@import "homepage/second-file";

[failwyn]

I’d be happy to take a look at it if you can get me a reproduction sample; config and scss files.

[razvan000]

sure, here goes:

compilerconfig.json

[
  {
    "inputFile": "wwwroot/css/Styles/homepage.scss",
    "outputFile": "wwwroot/css/Styles/homepage.css",
    "minify": {
      "enabled": true
    },
    // added the following bit , thinking the issue might be related to invisible white space, but it doesn't really help
    "options": {
      "lineFeed": "crlf"
    }
  }
]

homepage.scss

@charset "utf-8";
@import "libs/first-file";
@import "homepage/second-file";

wwwroot/libs/first-file.scss

This one is just a library, i.e bootstrap so the contents are from their cdn: https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap-theme.min.css

wwwroot/homepage/second-file.scss

.second-file {
    color: red;

    p {
        font-style: normal;
    }

    .custom-input:focus {
        border-color: inherit;
        box-shadow: none;
    }

    .left-panel {
        color: blue;
        font-size: 18px;
        text-shadow: initial;
        top: 63%;
        white-space: nowrap;
        left: -1rem;
    }

    .right-panel {
        color: blue;
        font-size: 18px;
        text-shadow: initial;
        top: 63%;
        white-space: nowrap;
        right: -1rem;
    }

    section {
        font-size: 18px;
    }

    .title {
        font-weight: bold;
    }

    .btn {
        @include sm {
            min-width: 25% !important;
            margin: 10px 0px 20px 10px;
        }

        @include mobile {
            width: 100%;
            margin: 20px 0px 10px 0px;
        }
    }
}

steps to reproduce

Checkout to a different branch. Sometimes a git operation (pull/merge) or a rebuild is required but ultimately, the .css files (homepage and homepage.min) will appear in git changes, having 0 visible modifications.

Thanks for the patience

[razvan000]

@failwyn any updates on this issue?

[failwyn]

@razvan000 I'm not able to replicate it; I'm compiling all of the Kendo SASS themes in my application and I'm not seeing any unintended changes in git. Is it possible that your git is changing the line endings?

[BryanAldrich]

I'm still having this issue, i'm on VS2022 Pro, the files actually show as having a LF ending, but i'm on windows. I tried setting the linefeeds to CRLF, but no dice.

[6rill2000]

We have the same problem. Is it possible to add a parameter to choose the type of end of line? Using the Git function to transform the end of lines under Windows, the differences disappear after a "Git add" but it is very disturbing because sometimes it does not and after a while we no longer pay attention to what we cancel in Git as we have to cancel everytime a bundle / minification happens.
If you could do something about that that would be great.

[BryanAldrich]

so, i was researching. the less compiler always outputs as LF files, git will autocrlf files to/from the server to match the client settings (windows vs linux, etc). This is what is causing the "difference".

[BryanAldrich]

https://docs.github.com/en/get-started/getting-started-with-git/configuring-git-to-handle-line-endings

I added a .gitattributes with this

• text=auto
  *.css text=lf

The other options would be to tag into this compiler to set the cr/lf based on the settings here, but that is beyond what I have time for.

[jansokoly]

When trying to solve this, I've realized lineFeed is actually a configuration option of Node-Sass, not Dart-Sass. And given that the extension defaults to using Dart-Sass, you need to instruct it to use Node-Sass for lineFeed to have the desired effect:

"options": {
  "lineFeed": "crlf",
  "outputStyle": "expanded"
},
"useNodeSass": true

[failwyn]

I'm going to be removing Node Sass from future release since it is no longer supported and gives errors when trying to compile it.