Sylius 2 fonctionne-t-il encore avec Semantic UI ?

Pas nativement. Le guide officiel de mise à niveau indique que toutes les classes Semantic UI ont été remplacées par des classes Bootstrap, dans l'administration comme dans la boutique. Les seules façons de garder Semantic UI sont le LegacyShopBridgePlugin, expérimental, ou une feuille de style que vous maintenez vous-même dans votre thème.

Mon administration personnalisée en Semantic UI va-t-elle s'afficher correctement ?

Non, pas telle quelle. L'administration de Sylius 2 est entièrement en Bootstrap 5 et pilotée par les Twig Hooks. Vos écrans d'administration surchargés doivent être réécrits avec les nouveaux gabarits, sinon ils s'affichent sans style ou ne sont plus appelés du tout.

Faut-il refaire le design de la boutique pour passer à Bootstrap 5 ?

Non. Le design que voient vos clients peut rester le même : ce sont les classes CSS et la structure HTML qui changent. Les couleurs, les typographies et les espacements se reportent dans les variables Sass de Bootstrap, ce qui évite de repartir d'une page blanche.

Peut-on ajouter jQuery soi-même pour garder les composants Semantic UI ?

Techniquement oui, puisque c'est votre code. Mais Sylius 2 a retiré jQuery de son propre front, donc vous porteriez seul une dépendance que plus rien ne justifie côté Sylius. Je le réserve à une transition courte et datée, jamais à une solution définitive.

Sylius 2 : faut-il obligatoirement abandonner Semantic UI ?

Oui pour l'administration, pas forcément tout de suite pour la boutique. Sylius 2 a remplacé Semantic UI et jQuery par Bootstrap 5 et Symfony UX : l'administration fournie par Sylius ne contient plus une seule classe Semantic UI, et vos écrans d'administration personnalisés doivent suivre. Côté boutique, vous pouvez garder l'ancien front pendant une transition grâce au LegacyShopBridgePlugin, ou maintenir votre propre feuille de style, mais vous devenez alors seul responsable d'un socle que Sylius a abandonné. À terme, quitter Semantic UI est la seule voie durable.

Je suis développeur Sylius indépendant à Metz et j'ai mené des montées de version Sylius 1.x vers 2.x de boutiques en production. Cette question revient presque à chaque premier rendez-vous, souvent formulée autrement : « est-ce qu'on doit refaire le site ? ». La réponse courte est non, le design peut rester. Ce qui part, c'est le code qui le dessine.

Que dit la documentation officielle sur Semantic UI dans Sylius 2 ?

Le guide officiel UPGRADE-2.0 est sans ambiguïté. Dans sa partie consacrée au front, il indique que toutes les classes CSS de Semantic UI ont été remplacées par des classes Bootstrap, que les composants JavaScript qui reposaient sur Semantic UI ont été réécrits avec les plugins JavaScript de Bootstrap, et que les CSS personnalisées de Sylius ont cédé la place aux classes utilitaires de Bootstrap. Le même document annonce la suppression de jQuery : l'essentiel du JavaScript a été remplacé par Symfony UX et Stimulus, avec des Live Components.

Le paquet @sylius-ui/frontend et le script semantic-ui-css-patch, présents dans le package.json d'une installation 1.14 standard, n'existent plus dans celui de Sylius 2. Autrement dit, il n'y a pas de réglage à cocher pour « rester en Semantic UI » : la bibliothèque n'est tout simplement plus livrée.

Faut-il abandonner Semantic UI côté boutique ?

Pas forcément le jour de la migration. Trois situations se présentent, et le bon choix dépend de la personnalisation de votre thème et de votre calendrier.

Garder l'ancien front avec le LegacyShopBridgePlugin

Sylius publie un plugin, le LegacyShopBridgePlugin, qui permet à une application Sylius 2 d'utiliser le front de boutique 1.x, avec ses gabarits Semantic UI et ses template events. Il sert à découpler les chantiers : le cœur et l'administration passent en version 2, la boutique suit plus tard. Le plugin est expérimental et réintroduit des briques que Sylius 2 a retirées. Je le traite en détail dans l'article sur la migration progressive avec le Legacy Bridge.

Maintenir votre propre feuille de style Semantic UI

Votre thème vous appartient. Rien ne vous empêche techniquement de charger vous-même la CSS de Semantic UI dans votre point d'entrée Webpack Encore. Le problème est ailleurs : chaque gabarit natif de Sylius 2 que vous n'avez pas surchargé arrive avec des classes Bootstrap, donc votre boutique mélange deux systèmes. Et les modules JavaScript de Semantic UI (menus déroulants, fenêtres modales, onglets) s'appuient sur jQuery, que Sylius ne charge plus. Vous réintroduisez alors à la main une dépendance que plus rien ne justifie, pour un résultat bancal.

Réécrire le thème en Bootstrap 5

C'est la voie que je recommande dès que la boutique a plusieurs années devant elle. Le rendu peut rester identique pour vos clients : les couleurs, les polices et les espacements se reportent dans les variables Sass de Bootstrap, et la structure de vos pages se recrée avec les Twig Hooks. Je détaille la méthode pour garder un design travaillé dans l'article sur le storefront fortement personnalisé.

Et côté administration, a-t-on le choix ?

Non. Le pont évoqué plus haut ne concerne que la boutique. L'administration de Sylius 2 est neuve, en Bootstrap 5, construite sur les Twig Hooks et des composants Symfony UX. Si vous aviez ajouté des colonnes dans une grille, un onglet dans la fiche produit ou un tableau de bord maison en Semantic UI, ces écrans sont à reprendre avec la nouvelle structure.

La bonne nouvelle, c'est que l'administration personnalisée est souvent plus légère que la boutique. Les ajouts sont fréquents mais localisés, et le système de hooks permet d'insérer un bloc dans un écran existant sans recopier tout le gabarit. Sur les boutiques que j'ai migrées, c'est rarement l'administration qui fait déraper le calendrier.

Ce que l'abandon de Semantic UI change pour le dirigeant

Pour vos clients, rien de visible si le travail est bien fait : mêmes pages, même charte, même parcours d'achat. Pour vous, trois choses changent. Le chantier front devient souvent le poste le plus lourd de la migration, parce que c'est la partie la plus personnalisée d'une boutique. Le recrutement devient plus simple, puisque Bootstrap 5 et Stimulus sont des technologies que la plupart des développeurs Symfony connaissent. Et chaque montée de version suivante coûte moins cher, car votre thème repose enfin sur le même socle que Sylius.

Garder Semantic UI pour économiser maintenant revient à reporter la facture en l'alourdissant : plus le temps passe, plus le décalage entre vos gabarits et ceux de Sylius grandit. Si vous voulez savoir ce que ce chantier représente sur votre boutique avant de trancher, le diagnostic de migration Sylius 2 le chiffre en jours, gabarit par gabarit.

Comment mesurer ce que représente la sortie de Semantic UI ?

On ne devine pas, on compte. J'ai créé Sylius Upgrade Analyzer, l'outil open source que j'ai publié sur le Sylius Store, pour cette étape : il s'exécute en local sur votre projet, compte les gabarits surchargés et les classes Semantic UI concernées, et associe une estimation en heures à chaque problème. Votre code ne quitte pas votre machine.

Je complète ensuite à la main ce qu'une analyse statique ne voit pas : les scripts jQuery maison noyés dans des gabarits, les plugins tiers qui injectent leur propre interface, et les pages qui rapportent le plus et méritent une recette visuelle soignée. La réécriture technique elle-même, composant par composant, est décrite dans le guide sur la migration du frontend vers Bootstrap 5 et Stimulus.

Ce que je vous propose

La 1.14 cesse de recevoir des correctifs de sécurité le 31 décembre 2026. La question n'est donc pas de savoir si Semantic UI partira, mais quand et dans quel ordre. Je lance Sylius Upgrade Analyzer sur votre projet, je vous dis combien de gabarits et d'écrans sont concernés, si le LegacyShopBridgePlugin a du sens chez vous, et je vous remets un diagnostic offert avec une estimation en jours. Je vous rappelle sous 24 heures ouvrées, et le rapport vous reste, même si vous confiez le chantier à quelqu'un d'autre.