Format with Shift + Alt + F

[7up-charsi]

Format with Shift + Alt + F does not work in vscode but prettier works.

i am used to organize imports and format document with Shift + Alt + F. Prettier works bydefault in vscode but biome only works on safe.

i used pnpx ultracite init to setupt biome and here its my settings.json

{
  "typescript.experimental.useTsgo": false,
  "editor.defaultFormatter": "biomejs.biome",
  "[javascript]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[typescript]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[json]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[css]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "[graphql]": {
    "editor.defaultFormatter": "biomejs.biome"
  },
  "typescript.tsdk": "node_modules/typescript/lib",
  "editor.formatOnSave": true,
  "editor.formatOnPaste": true,
  "emmet.showExpandedAbbreviation": "never",
  "editor.codeActionsOnSave": {
    "source.fixAll.biome": "explicit",
    "source.organizeImports.biome": "explicit"
  }
}

[nhedger]

I dont think this is a Biome issue.

As long as Biome is configured as the default formatter for a file and you bind your shortcut to the editor.action.formatDocument command, the documents gets formatted when using the shortcut.

Make sure that Biome is actually registered as a formatter. For example, if the Biome configuration is broken it may not properly register.

[7up-charsi]

hi @nhedger , i can format document with shortcut but imports and tailwind classes only organize/sort on save.

with prettier ans eslint, i am used to organize imports, sort tailwind classes, format sql in js and format document with one shortcut instead on save/paste.

[nhedger]

Ah that makes sense, this is because they are not part of formatting.

You should be able to map the editor.action.organizeImports command to a shortcut to do that.

Not sure if you can map multiple commands to the same shortcut tho

[7up-charsi]

i have this

{
  "key": "shift+alt+o",
  "command": "editor.action.organizeImports",
  "when": "textInputFocus && !editorReadonly && supportedCodeAction =~ /(\\s|^)source\\.organizeImports\\b/"
}

but this shortcut organize imports with typescript

[7up-charsi]

these settings worked for me
keybindings.json

  {
    "key": "shift+alt+o",
    "command": "editor.action.codeAction",
    "args": { 
      "kind": "source.fixAll.biome",
      "apply": "ifSingle",
    },
    "when": "editorHasDocumentFormattingProvider && editorTextFocus && !editorReadonly && !inCompositeEditor && supportedCodeAction =~ /source\\.fixAll\\.biome/"
  },
  {
    "key": "shift+alt+f",
    "command": "editor.action.formatDocument",
    "when": "editorHasDocumentFormattingProvider && editorTextFocus && !editorReadonly && !inCompositeEditor"
  },

settings.json

  "editor.formatOnSave": false,
  "editor.formatOnPaste": false,

i removed these

  "editor.codeActionsOnSave": {
    "source.fixAll.biome": "explicit",
    "source.organizeImports.biome": "explicit"
  }