Chapitre 7. Plugins dynamiques
7.1. Aperçu des plugins dynamiques
7.1.1. A propos des plugins dynamiques
Un plugin dynamique vous permet d'ajouter des pages personnalisées et d'autres extensions à votre interface au moment de l'exécution. La ressource personnalisée ConsolePlugin
enregistre les plugins avec la console, et un administrateur de cluster active les plugins dans la configuration console-operator
.
7.1.2. Caractéristiques principales
Un plugin dynamique vous permet d'apporter les personnalisations suivantes à l'expérience OpenShift Container Platform :
- Ajouter des pages personnalisées.
- Ajouter des perspectives au-delà de l'administrateur et du développeur.
- Ajouter des éléments de navigation.
- Ajouter des onglets et des actions aux pages de ressources.
7.1.3. Lignes directrices générales
Lors de la création de votre plugin, suivez ces lignes directrices générales :
-
Node.js
etyarn
sont nécessaires à la construction et à l'exécution de votre plugin. -
Préfixez les noms de vos classes CSS par le nom de votre plugin pour éviter les collisions. Par exemple,
my-plugin__heading
etmy-plugin_\_icon
. - Veiller à la cohérence de l'aspect, de la convivialité et du comportement avec les autres pages de la console.
Suivez les directives de localisation de react-i18next lors de la création de votre plugin. Vous pouvez utiliser le crochet
useTranslation
comme dans l'exemple suivant :conster Header: React.FC = () => { const { t } = useTranslation('plugin__console-demo-plugin'); return <h1>{t('Hello, World!')}</h1>; };
- Évitez les sélecteurs qui pourraient affecter le balisage en dehors des composants de votre plugin, tels que les sélecteurs d'éléments. Ce ne sont pas des API et ils sont susceptibles d'être modifiés. Leur utilisation peut endommager votre plugin. Évitez les sélecteurs comme les sélecteurs d'éléments qui pourraient affecter le balisage en dehors des composants de votre plugin.
Lignes directrices de PatternFly 4
Lors de la création de votre plugin, suivez les instructions suivantes pour l'utilisation de PatternFly :
- Utilisez les composants PatternFly4 et les variables CSS PatternFly. Les composants de base de PatternFly sont disponibles via le SDK. L'utilisation des composants et des variables PatternFly permet à votre plugin d'être cohérent dans les futures versions de la console.
- Rendez votre plugin accessible en suivant les principes fondamentaux d'accessibilité de PatternFly.
- Évitez d'utiliser d'autres bibliothèques CSS telles que Bootstrap ou Tailwind. Elles peuvent entrer en conflit avec PatternFly et ne correspondront pas à l'apparence de la console.