Change detected and watching works but nothing is changing.

[jonathan-ober]

I am having an issue with my Watch Sass is on and saving shows "Change Detected" but nothing is actually happening.

I thought my json was configured properly as it came from a coworker who doesn't have issues. But it's still not generating the updated file.

The code below is what is in my json file.

{
    "liveSassCompile.settings.formats": [
      {
        "format": "compressed",
        "extensionName": ".css",
        "savePath": null
      }
    ],
    "liveSassCompile.settings.generateMap": false,
    "liveSassCompile.settings.includeItems": [
      "**/wordpress/wp-content/themes/familylife-theme/assets/css/front-styles.scss",
      "**/wordpress/wp-content/themes/familylife-theme/assets/css/**",
    ],
    "liveSassCompile.settings.excludeList": [
      "**/node_modules/**",
      ".vscode/**",
      "**/wordpress/wp-content/themes/familylife-theme/assets/css/additional-styles/**",
      "**/wordpress/wp-content/themes/familylife-theme/assets/css/front-styles-rtl.scss"
    ],
    "liveSassCompile.settings.generateMap": false,
    "git.confirmSync": false,
    "explorer.confirmDelete": false,
    "launch": {
      "configurations": [],
      "compounds": []
    },
    "workbench.colorCustomizations": {},
    "window.zoomLevel": 2,
  }

[glenn2223]

I'd need to see the log output please.

---

Unrelated: you have the generateMap in there twice

[glenn2223]

if you set the showOutputWindowOn setting to trace it can help find out if there's an issue

My initial thoughts are the file you're saving is excluded or there's an error being thrown

[jonathan-ober]

Glenn, thanks for replying. I am a n0ob when it comes to json and navigating this based on what a contractor sent me. I am not 100% sure if how he is set up that it should be the same for me. Not sure if it makes a difference but I am on a Mac and he was working on a PC. I don't want to assume the code should work as-is from the other dev.

He also told me that it took him a bit to get to where the json file was working in the way that he needed. I.e. making edits to files within the wordpress theme and the changes generating the updated font-styles.scss/.css file after saving out the new .scss file within the folder structure.

My understanding of the json updates are basic, I currently have the following code in place:

{
  "showOutputWindowOn":"trace",
  "liveSassCompile.settings.formats": [
    {
      "format": "compressed",
      "extensionName": ".css",
      "savePath": null
    }
  ],
  "liveSassCompile.settings.generateMap": false,
  "liveSassCompile.settings.includeItems": [
    "/**/wordpress/wp-content/themes/familylife-theme/assets/css/front-styles.scss",
    "/**/wordpress/wp-content/themes/familylife-theme/assets/css/**"
  ],
  "liveSassCompile.settings.excludeList": [
    "/**/node_modules/**",
    "/.vscode/**",
    "/**/wordpress/wp-content/themes/familylife-theme/assets/css/additional-styles/**",
    "/**/wordpress/wp-content/themes/familylife-theme/assets/css/front-styles-rtl.scss"
  ],
  "git.confirmSync": false,
  "explorer.confirmDelete": false,
  "launch": {
    "configurations": [],
    "compounds": []
  },
  "workbench.colorCustomizations": {},
  "window.zoomLevel": 2,
}

I am getting an error Must start with a path separator (/ or \) and end with a .sass or .scss on the line: /**/wordpress/wp-content/themes/familylife-theme/assets/css/**

When I save my .scss with Watch SASS activated I see the Watching... and Success green change on Save. But I am not seeing my newly generated front-styles change or affected, which I presume to be what should happen.

And maybe I am completely off, but otherwise, I am unsure of how to proceed and if I am asking the right questions and have the correct set up for what needs done.

I appreciate any and all direction as this is all new to me and the method of updating is forcing me to ponder life through an existential crisis.

[glenn2223]

Sorry for the delay. Glad to help where I can.

I currently have the following code in place:

{
  "showOutputWindowOn":"trace",

Sorry, I should have been more specific. This line should read "liveSassCompile.settings.showOutputWindowOn":"trace",. This will produce more output that should help identify the issue.

I am getting an error Must start with a path separator (/ or \) and end with a .sass or .scss on the line: /**/wordpress/wp-content/themes/familylife-theme/assets/css/**

As the warning says, you need to end with .scss. To remove the warning you need to put /*.scss on the end.

When I save my .scss with Watch SASS activated I see the Watching... and Success green change on Save. But I am not seeing my newly generated front-styles change or affected, which I presume to be what should happen.

The success message means the compiler has done its job. Try deleting the existing CSS file you're expecting it to update and resave the SCSS file. If the CSS file is created, the compiler is working and the issue must be with the SCSS changes not producing your desired output. If the fire isn't created where you expect the output from the new setting will give more details on where it's trying to save to.

Another thing that may be causing an issue is if they're actually shadow files on your Mac

---

If you can't get to the bottom of it. Paste the extended output in a new comment here (pop it in triple ``` to format it correctly for me, thanks 😁)

[glenn2223]

Closing as info required