L'année dernière, le 19 août a été une journée spéciale pour Bootstrap - non seulement le quatrième anniversaire du projet, mais aussi le jour où la version bêta interne de Bootstrap 4 a été publiée après un an de développement intensif. Bootstrap 4 est une mise à jour majeure qui implique presque toutes les lignes de code.
1. Nouvelles fonctionnalités
Il y a trop de mises à jour majeures dans Bootstrap 4, et cet article ne peut pas tout couvrir. Voici quelques faits saillants qui ont attiré beaucoup d'attention:
Migrant de moins à Sass: Bootstrap se joint maintenant à la famille Sass. Grâce à Libsass, Bootstrap se compile plus rapidement qu'auparavant;
Améliorez le système de grille: ajoutez une nouvelle couche de grille pour s'adapter aux appareils mobiles et réorganiser le mélange sémantique.
Prend en charge la sélection du modèle de boîte élastique (Flexbox): il s'agit d'une fonction de fabrication d'époches - tant qu'une variable booléenne est modifiée, vous pouvez rapidement disposer les avantages de Flexbox.
Les puits, les miniatures et les panneaux sont abandonnés et les cartes sont utilisées à la place: les cartes sont un tout nouveau concept, mais il est très similaire aux puits, aux miniatures et aux panneaux, et est plus pratique.
Intégrez tous les feuilles de styles de réinitialisation HTML dans le redémarrage: le redémarrage peut être utilisé partout où normaliser.css n'est pas disponible, il offre plus d'options. Par exemple, le dimensionnement de la boîte: Border-Box, Ajustements de marge, etc. est stocké dans un fichier SASS séparé.
Nouvelles options de personnalisation: ne plus d'effets séparés tels que les gradients, les fonds, les ombres, etc. dans une feuille de style séparée comme dans la version précédente. Au lieu de cela, déplacez toutes les options dans une variable SASS. Vous souhaitez définir un effet par défaut pour les coins globaux ou non soulignés? C'est très simple, mettez simplement à jour la valeur de la variable et la recompile.
IE8 n'est plus pris en charge, en utilisant des unités REM et EM: l'abandon du support pour IE8 signifie que les développeurs peuvent utiliser les avantages du CSS en toute confiance, et il n'est pas nécessaire d'étudier les compétences de piratage de CSS ou les mécanismes de secours. REM et EM au lieu des unités PX conviennent plus aux dispositions réactives et à contrôler les tailles de composants. Si vous souhaitez prendre en charge IE8, vous ne pouvez continuer à utiliser Bootstrap 3.
Réécrivez tous les plugins JavaScript: Pour profiter des nouvelles fonctionnalités de JavaScript, Bootstrap 4 réécrit tous les plugins avec ES6. Maintenant, nous fournissons le support UMD, les méthodes de démontage génériques, la vérification du type d'option et d'autres fonctionnalités.
Améliorez les info-bulles et les popovers Positionnement automatique: cette partie est grâce à l'aide de l'outil Tether.
Documentation améliorée: tous les documents sont réécrits au format Markdown, et certains exemples d'organisation du plug-in et des extraits de code sont ajoutés. La documentation sera plus pratique à utiliser et les travaux d'optimisation de la recherche sont également en cours.
Plus de modifications : prend en charge les contrôles de formulaire personnalisés, les blancs et les classes de remplissage, et comprend de nouvelles classes de services publics, etc.
Les mises à jour ci-dessus ne sont que la pointe de l'iceberg. La version V4 compte plus de 1 100 engagements et 120 000 lignes de mises à jour de code. Ces mises à jour peuvent être consultées dans le document V4-Alpha.
2. Plan de développement
Tout le code source de la version V4 est open source sur la branche V4-Dev de GitHub. De plus, il existe un V4 de développement et de suivi des relations publiques, publiant la liste des modifications et la liste à développer pour Master. Vous pouvez contribuer votre propre code pour améliorer ce projet.
Le plan global de développement et de publication est le suivant:
Plusieurs versions alpha seront également publiées en améliorations continues; Deux versions bêta seront publiées après que les nouvelles fonctionnalités et les nouvelles fonctions seront gelées pour des tests complets; 2 versions candidates seront publiées pour tester s'ils peuvent être utilisés dans l'environnement de production; Et la version finale sera publiée.
Il existe également un canal sur Slack qui discute spécifiquement de V4, et des bootstrapers peuvent être ajoutés ici.
3. Soutenir V3
Lorsque Bootstrap 3 a été publié, Bootstrap a renoncé à sa prise en charge de la version 2.x, causant des problèmes à de nombreux utilisateurs, et la même erreur ne sera pas commise une deuxième fois. Dans un avenir proche, l'équipe de développement continuera de corriger les bogues V3 et d'améliorer la documentation. Après la publication de V4, la documentation de V3 ne sera pas hors ligne.
4. Encore une chose ...
En plus de publier Bootstrap 4 Alpha, le responsable a également publié le thème bootstrap.
Ces thèmes prennent beaucoup d'énergie et ils ont eux-mêmes de nombreux outils, tout comme bootstrap lui-même.
Pour commencer, les sujets publiés incluent: Tableau de bord, application et marketing, en utilisant le protocole de licence à usage multiple.
Cliquez ici pour afficher plus d'informations sur le sujet.
5. Rétroaction
1) quelqu'un a mentionné que dans V3.5.5 (la dernière version stable), bootstrap.min.css est 123 Ko, tandis que dans le nouveau 4.0.0alpha bootstrap.min.css, il vaut la peine de célébrer.
2) Quelqu'un a rapporté que le thème du tableau de bord n'est pas complètement réactif, comme dans les tableaux -> L'historique des commandes.
3) Bootstrap a changé pour l'utilisation de SASS par défaut, ce qui a provoqué une discussion généralisée.
4) Certaines personnes ont également déclaré qu'une organisation était disposée à renoncer à la technologie ancienne (ne soutient plus IE8) et à réécrire la bibliothèque avec la nouvelle technologie (ES6), ce qui est digne de respect.
Si vous souhaitez toujours étudier en profondeur, vous pouvez cliquer ici pour étudier et vous attacher 3 sujets passionnants:
Tutoriel d'apprentissage bootstrap
Tutoriel pratique de bootstrap
Tutoriel d'utilisation du plug-in bootstrap
Ce qui précède est tout le contenu de cet article. J'espère que cela sera utile à l'apprentissage de tous et j'espère que tout le monde soutiendra davantage Wulin.com.