Configurazione dell'Editor
Personalizza il tuo editor di testo per migliorare l’esperienza di sviluppo di Astro e sbloccare nuove funzionalità.
VS Code
VS Code è un popolare editor di testo per i sviluppatori web, ideato da Microsoft. Il motore di VS Code alimenta anche i famosi editor di testo all’interno dei browser come GitHub Codespaces e Gitpod.
Astro funziona con qualsiasi editor di testo. Però, VS Code è l’editor di testo che consigliamo. Noi manteniamo un’estensione Astro per VS Code ufficiale che sblocca diverse caratteristiche chiave e miglioramenti dell’esperienza dello sviluppatore per i progetti Astro.
- Evidenziazione della sintassi dei file
.astro. - Informazioni sui tipi di TypeScript per i file
.astro. - VS Code Intellisense per il completamento del codice, suggerimenti e altro.
Per cominciare, installa l’estensione Astro VS Code oggi.
📚 Guarda come configurare TypeScript (EN) nel tuo progetto Astro.
Gli IDE di JetBrains
Il supporto iniziale per Astro è arrivato da WebStorm a Gennaio 2023. Puoi installare il plugin ufficiale attraverso JetBrains Marketplace oppure cercando “Astro” nella tab dei plugin dell’IDE. Questo plugin include proprietà come l’evidenziazione della sintassi, il completamento del codice e la formattazione, e in futuro ha intenzione di aggiungere anche funzionalità più avanzate. Il plugin è disponibile anche per tutti gli altri JetBrains IDEs con il supporto di JavaScript.
Il futuro Fleet IDE di JetBrains include il supporto del language server e sarà in grado di usare gli strumenti ufficiali di Astro.
Altri Editor di Testo
La nostra magnifica community mantiene diverse estensioni per altri editor popolari, compresi:
- VS Code Extension on Open VSX Official - L’estensione ufficale di Astro su VS Code Extension, disponibile sul registro Open VSXper piattaforme libere come VSCodium
- Nova Extension Community - Fornisce l’evidenziazione della sintassi e il completamento del codice per Astro all’interno di Nova
- Vim Plugin Community - Fornisce l’evidenziazione della sintassi, indentazione, e il supporto per il ripiegamento del codice per Astro all’insterno di Vim o Neovim
- Neovim LSP e TreeSitter Plugins Community - Fornisce l’evidenziazione della sintassi, treesitter parsing, e il completamento del codice per Astro all’interno di Neovim
Editor all’interno dei Browser
Oltre agli editor locali, Astro funziona bene anche in quelli ospitati nei browser, compresi:
- StackBlitz e CodeSandbox - editor che si possono utilizzare online e che vengono eseguiti nel tuo browser, con annesso il supporto per l’evidenziazione della sintassi per i file
.astro. Nessuna installaszione o configurazione sono necessarie! - GitHub.dev - ti permette di installare l’estensione Astro VS Code come un’estensione web, che ti permette l’accesso solo ad alcune delle proprietà dell’estensione completa. Al giorno d’oggi, solo l’evidenziazione della sintassi è supportata.
- Gitpod - un ambiente di sviluppo completo nel cloud che può installare l’estensione ufficiale Astro VS Code da Open VSX.
Altri strumenti
ESLint
ESLint è un linter famoso per JavaScript e JSX. Per il supporto per Astro, un plugin mantenuto dalla community può essere installato.
Vedi la Guida per l’utente del progetto per maggiori informazioni su come installare e configurare ESlint per il tuo progetto.
Stylelint
Stylelint è un linter famoso per CSS. Una configuarazione Stylelint mantenuta dalla community fornisce il supporto per Astro.
Le istruzioni per l’installaszione, l’integrazine dell’editor, e altre informazioni aggiuntive possono essere trovate all’interno del file README del progetto.
Prettier
Prettier è un famoso formatter per JavaScript, HTML, CSS, ed altro. Se usi l’estensione Astro VS Code oppure il server di lingua Astro all’interno di un’altro editor, Prettier include la formattazione.
Per aggiungere il supporto per la formattazione dei file .astro al di fuori degli editor (per esempio CLI) o all’interno degli editor che non supportano gli strumenti per il nostro editor, installa il plugin ufficiale Astro Prettier.
Per iniziare, prima installa Prettier ed il plugin:
npm install --save-dev prettier prettier-plugin-astropnpm install -D prettier prettier-plugin-astroyarn add --dev prettier prettier-plugin-astroPrettier rivelerà automaticamente il plugin e lo userà per processare i file .astro quando esegui:
prettier --write .Vedi README del plugin di Prettier per maggiori informazionis ulle opzioni supportate, come configurare Prettier all’interno di VS Code, e altro.
Learn