Question 1

Cos'è Prettier Config Generator?

Accepted Answer

Uno strumento web interattivo gratuito che permette di configurare visivamente ogni opzione di Prettier e copiare istantaneamente il file .prettierrc risultante.

Question 2

Cos'è Prettier e perché usarlo?

Accepted Answer

Prettier è un formattatore di codice che applica uno stile coerente a tutta la codebase, eliminando le discussioni sullo stile nelle code review.

Question 3

Cos'è un file .prettierrc?

Accepted Answer

Un file di configurazione nella radice del progetto che dice a Prettier come formattare il codice.

Question 4

Come usare questo strumento per generare la configurazione?

Accepted Answer

Seleziona le opzioni Prettier sulla pagina principale. La configurazione si aggiorna in tempo reale. Clicca "Copia configurazione" e incolla il JSON in un file .prettierrc.

Question 5

Prettier Config Generator è gratuito?

Accepted Answer

Sì, completamente gratuito. Nessuna registrazione, nessun account, nessun limite di utilizzo.

Question 6

Questo strumento copre tutte le opzioni di Prettier?

Accepted Answer

Sì. Include ogni opzione Prettier ufficialmente supportata con descrizioni e valori predefiniti.

Question 7

Come copiare e usare la configurazione generata?

Accepted Answer

Clicca "Copia configurazione" nella barra laterale (desktop) o sul pulsante mobile.

Question 8

Qual è la differenza tra .prettierrc, prettier.config.js e la chiave prettier in package.json?

Accepted Answer

Tutti e tre sono metodi validi. .prettierrc supporta JSON/YAML, prettier.config.js è un modulo JavaScript, la chiave prettier in package.json tiene tutto in un file.

Question 9

Prettier funziona con TypeScript, React e Vue?

Accepted Answer

Sì. Supporto integrato per TypeScript, JSX/TSX, componenti Vue e molti altri formati.

Question 10

Come integrare Prettier con VS Code?

Accepted Answer

Installa l'estensione "Prettier - Code formatter" e aggiungi formatOnSave: true nelle impostazioni VS Code.

Question 11

Come eseguire Prettier su tutto il progetto?

Accepted Answer

Esegui npx prettier --write . nella radice del progetto.

Question 12

Quali linguaggi e tipi di file supporta Prettier?

Accepted Answer

JavaScript, TypeScript, JSX, CSS, HTML, Vue, JSON, YAML, Markdown e altro.

Question 13

Come escludere file dalla formattazione Prettier?

Accepted Answer

Crea un file .prettierignore nella radice del progetto.

Question 14

Posso usare Prettier insieme a ESLint?

Accepted Answer

Sì. Installa eslint-config-prettier.

Question 15

Cosa fa l'opzione printWidth?

Accepted Answer

Imposta la lunghezza riga target. Default 80.

Question 16

Qual è la differenza tra singleQuote e jsxSingleQuote?

Accepted Answer

singleQuote controlla le virgolette in JS/TS, jsxSingleQuote controlla gli attributi JSX.

Question 17

Come usare la funzione di ricerca?

Accepted Answer

Usa la barra di ricerca in cima alla pagina.

Question 18

Questo sito supporta la modalità scura?

Accepted Answer

Sì. Clicca il pulsante tema nell'intestazione.

Question 19

Qual è la configurazione predefinita di Prettier?

Accepted Answer

printWidth: 80, tabWidth: 2, semi: true, singleQuote: false, trailingComma: "all".

Question 20

Come segnalare un bug o contribuire?

Accepted Answer

Apri una issue o una pull request nel repository GitHub.

Question 21

Quali versioni di Prettier supporta questo strumento?

Accepted Answer

Puoi scegliere qualsiasi versione 3.x di Prettier dal menu a tendina — da 3.0 a 3.6 più "latest". Il bundle della versione selezionata viene caricato a richiesta da jsDelivr, quindi l'elenco delle opzioni corrisponde sempre allo schema reale di quella versione.

Question 22

Quali linguaggi posso formattare nella scheda Il tuo codice?

Accepted Answer

TypeScript, JavaScript, Flow, CSS, SCSS, Less, HTML, Vue, template Angular, JSON, JSON5, JSON con commenti, Markdown, MDX, YAML e GraphQL. Il parser viene rilevato automaticamente dall'input, ma puoi sovrascriverlo con il menu a tendina.

Question 23

Come funziona l'URL condivisibile?

Accepted Answer

Clicca il pulsante di condivisione e la versione corrente di Prettier, le opzioni selezionate, il codice e l'override del parser vengono compressi con LZ nell'hash dell'URL, quindi copiati negli appunti. Aprire quel link ripristina esattamente la stessa configurazione. Nulla viene inviato a un server — tutto resta nel browser.

Question 24

Cosa significa il conteggio dei token accanto al diff?

Accepted Answer

Mostra quanti token IA costerebbero il tuo input e output con il modello selezionato. GPT-4o / GPT-4 / GPT-3.5 usano i tokenizzatori BPE ufficiali per un conteggio esatto; Claude, Gemini, Llama e Mistral usano un'approssimazione basata sui caratteri con il prefisso "~".

Question 25

Il mio lavoro sopravvive a un aggiornamento della pagina?

Accepted Answer

Sì. La tua versione di Prettier, le selezioni delle opzioni e le preferenze di vista divisa / tokenizzatore vengono salvate in localStorage, quindi un ricaricamento ripristina tutto. Un hash URL condivisibile ha la precedenza se è presente quando apri la pagina.

Question 26

Perché a volte appare la striscia di errore di formato?

Accepted Answer

Quando il parser di Prettier non riesce ad analizzare il tuo input — di solito perché il parser scelto non corrisponde al codice (ad esempio CSS scelto ma hai incollato JSX) — il messaggio di errore appare in una striscia rossa sopra il diff. Cambia il parser per farlo corrispondere al tuo codice e l'errore scompare.

Question 27

Posso visualizzare l'anteprima della mia configurazione con linguaggi diversi da JavaScript?

Accepted Answer

Sì. La tab Preview ha un proprio dropdown di parser accanto al toggle del diff, e ogni parser è accompagnato da un esempio creato apposta — CSS, SCSS, Less, HTML, Vue, Angular, JSON / JSON5 / JSONC, Markdown, MDX, YAML, GraphQL, oltre a TypeScript / JS. Cambiare parser ri-formatta l'esempio corrispondente con le tue opzioni attuali, così opzioni specifiche del linguaggio come proseWrap, htmlWhitespaceSensitivity e vueIndentScriptAndStyle hanno un posto dove dimostrare il proprio effetto. La tua scelta persiste tra i ricaricamenti.

Domande Frequenti