如何配置VS Code使Prettier不在输入时干扰，仅自动保存后格式化？

To fix the issue where Prettier formats your code mid-typing while keeping auto-save enabled, adjust these VS Code settings:

1. Set Auto-Save to Trigger After a Delay #

This ensures VS Code only saves (and formats) after you stop typing for a specified period:

• Open VS Code settings (press Ctrl+, on Windows/Linux or Cmd+, on macOS).
• Search for Files: Auto Save and select afterDelay from the dropdown.
• Next, search for Files: Auto Save Delay and set a value like 1500 (1.5 seconds) or 2000 (2 seconds). Adjust this based on your typing speed—longer delays mean more time to finish typing before formatting kicks in.

2. Disable Format-On-Type #

Prevent Prettier from formatting as you type each character:

• In settings, search for Editor: Format On Type and uncheck the box.
• If you see a separate Prettier: Format On Type setting, uncheck that too.

3. Verify Format-On-Save is Enabled #

Make sure Prettier still formats when auto-save happens:

• Search for Editor: Format On Save and check the box.
• Search for Prettier: Format On Save and ensure it’s checked (this ensures Prettier is the tool handling the formatting on save).

4. Set Prettier as Default Formatter (Optional but Recommended) #

Ensure Prettier is the default formatter for your file types:

• Search for Editor: Default Formatter and select esbenp.prettier-vscode from the list.

Example Scenario After Adjustments #

When you type color: in your CSS file, VS Code will wait until you stop typing for the set delay (e.g., 1.5 seconds) before auto-saving and formatting. This gives you time to finish entering the color value (like color: red;) without the cursor jumping away mid-type.

内容的提问来源于stack exchange，提问作者Jon