How to format html and css code when vscode is saved (with eslint plug-in)

my configuration is as follows:

// 
  "eslint.autoFixOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "html",
      "autoFix": true
    },
    {
      "language": "vue",
      "autoFix": true
    }
  ],

then, when ctrl+s is saved, the < script > section will automatically repair for me, but < style > (css, less, sass) and < template > (html, pug) these two parts will not help me automatically repair, I have to manually indent, I wonder if there is a good way to format the three parts of the .vue file when saving?

Jun.21,2021

Ctrl + K + F

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b41456-2c597.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b41456-2c597.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?