Estensione Ufficiale per VS Code

Panoramica

Intlayer è l'estensione ufficiale di Visual Studio Code per Intlayer, progettata per migliorare l'esperienza dello sviluppatore quando si lavora con contenuti localizzati nei tuoi progetti.

Link all'estensione: https://marketplace.visualstudio.com/items?itemName=Intlayer.intlayer-vs-code-extension

Funzionalità

• Estrai Contenuto – Estrai contenuto dai tuoi componenti React / Vue / Svelte

• Navigazione Istantanea – Passa rapidamente al file di contenuto corretto cliccando su una chiave useIntlayer.
• Riempi Dizionari – Riempi i dizionari con i contenuti del tuo progetto.

• Accesso facile ai comandi Intlayer – Costruisci, invia, scarica, riempi, testa i dizionari di contenuti con facilità.

• Generatore di dichiarazioni di contenuto – Crea file di contenuto del dizionario in vari formati (.ts, .esm, .cjs, .json).

• Test dizionari – Testa i dizionari per traduzioni mancanti.

• Mantieni i tuoi dizionari aggiornati – Mantieni i tuoi dizionari aggiornati con i contenuti più recenti del tuo progetto.

• Scheda Intlayer (Barra attività) – Naviga e cerca nei dizionari da una scheda laterale dedicata con barra degli strumenti e azioni contestuali (Costruisci, Scarica, Invia, Riempi, Aggiorna, Testa, Crea file).

Uso

Navigazione rapida

1. Apri un progetto che utilizza react-intlayer.

2. Individua una chiamata a useIntlayer(), come:

   tsx

   Copia contenuto

   Copiare il codice

   Copiare il codice nella clipboard

   const content = useIntlayer("app");

3. Command-click (⌘+Click su macOS) o Ctrl+Click (su Windows/Linux) sulla chiave (ad esempio, "app").
4. VS Code aprirà automaticamente il file dizionario corrispondente, ad esempio, src/app.content.ts.

Scheda Intlayer (Barra attività)

Usa la scheda laterale per navigare e gestire i dizionari:

• Apri l'icona Intlayer nella Barra attività.
• In Cerca, digita per filtrare dizionari e voci in tempo reale.
• In Dizionari, esplora ambienti, dizionari e file. Usa la barra degli strumenti per Costruisci, Scarica, Invia, Riempi, Aggiorna, Testa e Crea file dizionario. Clic destro per azioni contestuali (Scarica/Invia sui dizionari, Riempi sui file). Il file attualmente aperto nell'editor si evidenzia automaticamente nell'albero quando applicabile.

Accesso ai comandi

Puoi accedere ai comandi dalla Command Palette.

Cmd + Shift + P (macOS) / Ctrl + Shift + P (Windows/Linux)

• Costruisci Dizionari
• Invia Dizionari
• Scarica Dizionari
• Riempi Dizionari
• Testa Dizionari
• Crea File Dizionario

Caricamento delle Variabili d'Ambiente

Intlayer consiglia di memorizzare le chiavi API AI, così come l'ID client e il segreto di Intlayer, nelle variabili d'ambiente.

L'estensione può caricare le variabili d'ambiente dal tuo workspace per eseguire i comandi Intlayer con il contesto corretto.

• Ordine di caricamento (per priorità): .env.<env>.local → .env.<env> → .env.local → .env
• Non distruttivo: i valori esistenti in process.env non vengono sovrascritti.
• Ambito: i file vengono risolti dalla directory base configurata (predefinita alla radice del workspace).

Selezione dell'ambiente attivo

• Palette dei Comandi: apri la palette ed esegui Intlayer: Select Environment, quindi scegli l'ambiente (ad esempio, development, staging, production). L'estensione tenterà di caricare il primo file disponibile nella lista di priorità sopra indicata e mostrerà una notifica come “Caricato env da .env.<env>.local”.
• Impostazioni: vai su Impostazioni → Estensioni → Intlayer, e imposta:
  • Ambiente: il nome dell'ambiente usato per risolvere i file .env.<env>*.
  • (Opzionale) File Env: un percorso esplicito a un file .env. Quando fornito, ha la precedenza sulla lista dedotta.

Monorepo e directory personalizzate

Se i tuoi file .env si trovano al di fuori della radice dello spazio di lavoro, imposta la Directory Base in Impostazioni → Estensioni → Intlayer. Il loader cercherà i file .env relativi a quella directory.