Panoramica

@generaltranslation/react-core-linter 0.1.0 introduce regole ESLint per l'integrazione con General Translation React Core.

Questo plugin rileva errori di implementazione comuni riscontrati nell'uso reale.

Installazione

npm install @generaltranslation/react-core-linter --save-dev

In questa versione iniziale sono incluse due regole:

• static-jsx - Impone il corretto utilizzo del wrapping delle variabili nei componenti <T>
• static-string - Garantisce l'uso di stringhe statiche nelle funzioni di traduzione

Convalida statica di JSX

La regola static-jsx impedisce che contenuti dinamici vengano inseriti direttamente all'interno dei componenti <T>. I contenuti dinamici devono essere racchiusi in componenti variabili.

// ❌ Errato
<T>Hello {userName}!</T>

// ✅ Corretto  
<T>Hello <Var>{userName}</Var>!</T>

Obbligo di stringhe statiche

La regola static-string garantisce che le funzioni di traduzione accettino solo stringhe fisse.

const gt = useGT();

// ❌ Errato
gt(`Hello ${name}`)
gt('Hello ' + name)

// ✅ Corretto
gt('Hello {name}!', { name })

Configurazione

Aggiungi alla configurazione di ESLint:

import { defineConfig } from 'eslint';
import gtLint from '@generaltranslation/react-core-linter';

export default defineConfig([
  gtLint.configs.recommended,
]);

Questa versione iniziale introduce funzionalità di linting di base per i pattern di traduzione di React Core. Le versioni future estenderanno la copertura delle regole e aggiungeranno la correzione automatica di altre violazioni comuni.

Per saperne di più

• Componenti variabili - Gestisci i contenuti dinamici nelle traduzioni
• Traduzione di stringhe - Traduci stringhe di testo normale