jsx-eslint/eslint-plugin-react

Rule proposal: ssr-friendly

Ouverte

#2 057 ouverte le 26 nov. 2018

Voir sur GitHubGuide contributeur
 (21 commentaires) (23 réactions) (0 personne assignée)JavaScript (2 731 forks)batch import
acceptedhelp wantednew rule

Métriques du dépôt

Stars
 (9 293 étoiles)
Métriques de merge PR
 (Métriques PR en attente)

Description

In order to be SSR compliant, you can only access browser globals such as window, document and so on, inside of componentDidMount, componentDidUpdate and componentWillUnmount

A rule could be created to avoid the use of unguarded browser globals in other lifecycle methods.

Example of a guard:

if (typeof window !== 'undefined') {
 // I can use browser globals in here
}

Use of browser globals are allowed when:

  • used in a guard
  • used in componentDidMount, componentDidUpdate and componentWillUnmount
  • used in useEffect or useLayoutEffect
  • used in an event handler

Guide contributeur

Direction de recherche
Analysez les règles existantes dans eslint plugin react pour comprendre le modèle de création d'une nouvelle règle. Implémentez ensuite une règle qui détecte les variables globales du navigateur non protégées (par exemple, window, document) dans les méthodes de cycle de vie autres que componentDidMount, componentDidUpdate, componentWillUnmount, useEffect, useLayoutEffect et les gestionnaires d'événements. Envisagez de fournir des options de correction automatique et de gérer les gardes comme 'typeof window !== "undefined"'.
Stack technique
javascriptreact
Domaine
frontendtooling
Type d'issue
Fonctionnalité
DifficultéDifficulté estimée pour un nouveau contributeur, de 1 pour un très petit changement à 5 pour un travail expert.
3
Temps estiméFourchette de temps approximative pour investiguer, implémenter, tester et préparer une pull request.
1-2 jours
Statut d'activitéDisponibilité apparente de l'issue : fraîche, active, ancienne, bloquée ou en attente d'un mainteneur.
Active
ClartéClarté avec laquelle l'issue explique le changement attendu, les critères d'acceptation et la prochaine étape.
Claire
Prérequis
ReactESLint
Accessibilité débutantScore de 1 à 100 estimant l'accessibilité de cette issue pour un premier contributeur.
60