jsx-eslint/eslint-plugin-react

How to prevent jsx-newline for elements and expressions on one line?

Open

#3.296 geöffnet am 23. Mai 2022

Auf GitHub ansehen
 (9 Kommentare) (2 Reaktionen) (0 zugewiesene Personen)JavaScript (2.797 Forks)batch import
help wanted

Repository-Metriken

Stars
 (8.630 Stars)
PR-Merge-Metriken
 (Keine gemergten PRs in 30 T)

Beschreibung

I have jsx-newline enabled, but how can I allow these cases where I want everything to stay on the same line? Without adding {/* eslint-disable[-line] react/jsx-newline */} around it?

<p>
  {t('text')} <span>{email}</span>
</p>

or

<div>
  {activeStep}/{steps}
</div>

It would be nice if there would be a setting that allowed for cases where everything is on the same line. So:

// BAD
<p>
  {t('text')} 
  <span>{email}</span>
</p>

// BOTH GOOD
<p>
  {t('text')} <span>{email}</span>
</p>

<p>
  {t('text')} 

  <span>{email}</span>
</p>

Contributor Guide

Research-Richtung
Untersuche den Quellcode von eslint plugin react, um die Datei der Regel 'jsx newline' zu finden. Verstehe, wie die Regel derzeit funktioniert, und überlege, eine Konfigurationsoption hinzuzufügen, die einzeilige Inhalte innerhalb mehrzeiliger JSX Elemente erlaubt. Sieh dir ähnliche Regeln zur Inspiration an.
Tech Stack
javascript
Domain
developer experience
Issue Type
Funktion
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
1-3 Stunden
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Aktiv
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Klar
Voraussetzungen
JavaScriptESLint
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
65