How do you get rid of these SASS linting errors when using Tailwind CSS?

Solution for both .css and .scss

1. At the root level of your project, update or create a directory, .vscode, with a file, settings.json:

   

2. Add the following to file .vscode/settings.json:

   {
     "css.validate": false,
     "less.validate": false,
     "scss.validate": false
   }
   

3. Install the vscode-stylelint extension

   

4. Install stylelint-config-standard:

   npm i stylelint-config-standard -D

5. Create a stylelint.config.js file at the root level and add:

   module.exports = {
     extends: ['stylelint-config-recommended'],
     rules: {
       "at-rule-no-unknown": [
         true,
         {
           ignoreAtRules: [
             "tailwind",
             "apply",
             "variants",
             "responsive",
             "screen",
           ],
         },
       ],
       "declaration-block-trailing-semicolon": null,
       "no-descending-specificity": null,
     },
   };
   

6. Restart Visual Studio Code

Results:

You get rid of these Sass linting errors when using Tailwind CSS and keep doing CSS validation with Stylelint.