settings.json in vscode does not work

Maybe the path is wrong, check again {"out": ".. /css/"}

You added "out" in settings.json: ".. /css/", but this configuration item only tells the Less compiler where to put the compiled CSS file, and does not automatically create the directory. Therefore, you need to create this directory manually in order for the Less compiler to generate CSS files.

You can follow these steps:

Create a css directory in the root of your project to store the compiled CSS files.

Open a Less file in VS Code and save it. At this point, the Less compiler should compile the file automatically and generate the appropriate css file in the CSS directory.

If you have manually created a css directory but still cannot generate CSS files, please check the following:

Check that the save path for your Less file is the same as the path in the out configuration item.

Make sure you don't have syntax errors in your Less file. Syntax errors can cause compilation failures.

Verify that you have installed the Less compiler plug-in and that the plug-in is active.

Make sure you have properly installed LESS and less-watch-compiler, which are key to compiling less into CSS and exporting it to the specified directory

If the less.pile out option is set to {"out": ".. /css/"}, but the css folder and corresponding.css file are not generated when saving the.less file. Possible causes and solutions are as follows:

Check whether the saved.less file path is correct and consistent with rootpath in settings.json. To access the directory where the.less file resides, run the lessc input.less.. /css/output.css, compile and test it manually.

If Auto Save is enabled in VS Code, you need to check if multiple VS Code Windows are open, one of which may have a less.pile setting that is inconsistent with the current window setting, causing an error at compile time.

Try reinstalling the less plug-in and VS Code, and then reconfiguring the settings.json file to see if you can generate the css file properly.

If you still can't fix the problem, try using another less compiler, such as gulp or grunt, or compile the.less file manually from the command line or terminal.

The following answers are based on ChatGPT and GISer Liu:
If you have correctly added the less.pile setting to VSCode's settings.json file, but save Less without generating a CSS folder and CSS file, there are several possible reasons:

• Less plug-in not installed: Install the Easy LESS plug-in or Less IntelliSense plug-in in VSCode, both of which provide the ability to compile Less. After installing the plug-in, you need to restart VSCode.

• Less plug-in is not configured correctly: Open Preferences: Open User Settings in VSCode, enter less.pile in the search box, and check whether less.pile is configured correctly. You can see the following configuration:

  "less.compile": {
  "out": "${workspaceRoot}/css/",
  "sourceMap": true,
  "sourceMapRootpath": "",
  "sourceMapFileInline": false,
  "outputSourceFiles": "true",
  "autoprefixer": {
    "browsers": ["last 2 versions", "ie >= 10"]
  }
  },
  

• Not saving the Less file correctly: Make sure your Less file is saved. When you save the Less file, it should automatically compile into a CSS file and generate a CSS folder.
  If all of the above are ruled out, you can try restarting VSCode and saving the Less file again to see if it compiles properly to CSS. If you still cannot generate CSS folders and CSS files, you can try to use another Less compiler to compile and check if the problem is Less code.

Refer to GPT and yourself. Based on the settings.json code you provided, it looks like the configuration syntax is correct. But there are a few things to note:

Ensure that you save the less file with the.less suffix, not.css. If you save the file with the.css suffix, the compiled CSS file will be overwritten or will not be generated.
Make sure your LESS file and settings.json file are in the same workspace. If the directory specified by the out attribute does not exist, the compiled CSS file will not be generated.
Checks permissions for the compile output directory. If you do not have write permission in the directory specified by the out attribute, the compiled CSS file will not be generated.
If you have confirmed the above problems and the less.pile configuration has no problems with the syntax, you may want to check if you have installed the vscode-less extension, which provides LESS compilation capabilities. If you don't have the extension installed, you can do so through VS Code's extension store.

If you use the Less compiler in VS Code and set less.pile in settings.json, However, the CSS folder and CSS file cannot be generated when saving the Less file, which may be one of the following reasons:

There may be a problem with your Settings. json file settings. Make sure you have correctly set "less.compile": {"outDir": ".. /css/"}, note that "files.associations" is added before "less.pile" to specify a Less file association. For example:

json
Copy code
"files.associations": {
   "*.less": "less"
},
"less.compile": {
   "outDir": "../css/"
}

There is a syntax error in your Less file that prevents the compiler from generating the CSS file. Check the syntax of the Less file to make sure there are no errors.

You may not have installed the Less compiler plug-in correctly in VS Code. Please go to the VS Code extension store and search for and install plug-ins such as "Easy Less", "Less IntelliSense", "Less", etc., to make sure they are properly installed and enabled.

If the above methods do not solve the problem, try restarting VS Code and saving the Less file again, or manually run the Less compile command in the terminal of VS Code to see if there is an error message.