Le hook useRewriteURL pour SolidJS est conçu pour gérer les réécritures d'URL localisées côté client. Il corrige automatiquement l'URL du navigateur vers sa version localisée « jolie » en fonction de la locale courante et de la configuration dans intlayer.config.ts.

En utilisant window.history.replaceState, il évite des navigations redondantes via Solid Router.

Utilisation

Appelez le hook à l'intérieur d'un composant faisant partie de votre application.

tsx

Copier le code

Copier le code dans le presse-papiers

import { useRewriteURL } from "solid-intlayer";tsx;const Layout = (props) => {  // Corrige automatiquement /fr/tests en /fr/essais dans la barre d'adresse si une règle de réécriture existe  useRewriteURL();  return <>{props.children}</>;};

import { useRewriteURL } from "solid-intlayer";tsx;const Layout = (props) => {  // Corrige automatiquement /fr/tests en /fr/essais dans la barre d'adresse si une règle de réécriture existe  useRewriteURL();  return <>{props.children}</>;};

Comment ça fonctionne

Détection : Le hook utilise createEffect pour surveiller les changements de la valeur réactive locale().
Correspondance : Il identifie si le window.location.pathname actuel correspond à une route canonique qui possède un alias localisé plus lisible pour la langue courante.
Correction de l'URL : Si un alias plus lisible est trouvé, le hook appelle window.history.replaceState pour mettre à jour la barre d'adresse sans affecter l'état de navigation interne ni provoquer de re-rendus des composants.

Pourquoi l'utiliser ?

URL canoniques : Imposent une URL unique pour chaque version localisée de votre contenu, ce qui est crucial pour le SEO.
Confort pour les développeurs : Vous permet de conserver vos définitions de routes internes canoniques tout en exposant des chemins localisés et conviviaux au public.
Cohérence : Corrige les URL lorsque les utilisateurs saisissent manuellement un chemin qui ne respecte pas vos règles de localisation préférées.

Pourquoi Intlayer ?