🐛 Fix: Corrige le déploiement GitHub Pages (chemins sous /gwada-sirius/)
Le site était bien déployé mais tous les chemins absolus (CSS/JS bundlés par Vite, polices, favicon, manifest, service worker, liens de nav/footer) pointaient vers la racine du domaine (/assets/..., /favicon.svg, /, /en/…) au lieu de /gwada-sirius/... — GitHub Pages sert un site de projet sous /<nom-du-repo>/, pas à la racine. Résultat : CSS et polices en 404, liens de navigation cassés. Ajoute une variable d'env BASE_PATH (vide par défaut, /gwada-sirius en CI via .github/workflows/deploy.yml) : passée à viteOptions.base pour que Vite préfixe lui-même les assets qu'il bundle, et à un filtre maison withBase/localeHref pour les liens de nav, favicon, manifest et l'enregistrement du service worker. Le manifest PWA passe en chemins relatifs pour ne pas avoir besoin d'être templaté. Vérifié en simulant un vrai déploiement (build préfixé servi depuis un sous-dossier /gwada-sirius/ d'un serveur statique) : plus aucune requête 404, navigation, service worker (scope correctement limité au sous-chemin) et carte Leaflet fonctionnels de bout en bout. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -12,6 +12,12 @@
|
||||
"runtimeExecutable": "npx",
|
||||
"runtimeArgs": ["eleventy", "--serve", "--port=8099"],
|
||||
"port": 8099
|
||||
},
|
||||
{
|
||||
"name": "gwada-sirius-ghpages-sim",
|
||||
"runtimeExecutable": "npx",
|
||||
"runtimeArgs": ["serve", "/tmp/gh-pages-sim", "-l", "8097"],
|
||||
"port": 8097
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -31,6 +31,8 @@ jobs:
|
||||
|
||||
- name: Build
|
||||
run: npm run build
|
||||
env:
|
||||
BASE_PATH: /${{ github.event.repository.name }}
|
||||
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
|
||||
@@ -23,6 +23,7 @@ Refonte complète (v2) : passage d'une SPA Vite+Svelte 4 à un site **11ty** sta
|
||||
3. **Dates ISO sans heure** : `new Date("2026-07-22")` est interprété en UTC ; formaté en heure locale Guadeloupe (UTC-4), ça peut reculer d'un jour. Toujours parser les composants (`year, month, day`) et construire la date en local — voir le filtre `formatDate` et `PredictionsCalculator.svelte`.
|
||||
4. **Slinkity est abandonné** (son créateur travaille sur Astro) : ne pas l'utiliser pour l'intégration 11ty+Svelte, `eleventy-plugin-vite` (officiel) est la voie robuste.
|
||||
5. **Service worker et cache obsolète** : la stratégie stale-while-revalidate de `public/sw.js` peut servir une version périmée des îlots (vécu pendant le debug de la carte : un visiteur déjà passé sur le site voyait l'ancien composant malgré un déploiement). **Toujours incrémenter `CACHE_NAME` dans `sw.js`** quand un îlot ou un asset critique change, sinon les visiteurs récurrents restent bloqués sur l'ancienne version jusqu'à revalidation.
|
||||
6. **GitHub Pages = sous-répertoire, pas la racine du domaine** : `https://cyber-mawonaj.github.io/gwada-sirius/` sert le site sous `/gwada-sirius/`, pas `/`. Tous les chemins absolus (`/assets/...`, `/favicon.svg`, liens de nav, `sw.js`) doivent donc être préfixés. Géré via la variable d'env `BASE_PATH` (vide en local/domaine perso, `/gwada-sirius` en CI — voir `.github/workflows/deploy.yml`) : passée à `viteOptions.base` pour les assets bundlés par Vite, et au filtre maison `withBase`/`localeHref` pour les liens et fichiers passthrough. Le manifest PWA utilise des chemins **relatifs** (`"start_url": "."`) pour ne pas avoir besoin d'être templaté. Pour retester ce scénario en local : `BASE_PATH=/gwada-sirius npm run build`, puis servir `_site` depuis un dossier `gwada-sirius/` à la racine d'un serveur statique.
|
||||
|
||||
## 🔄 Améliorations possibles
|
||||
|
||||
|
||||
+16
-1
@@ -7,6 +7,12 @@ import { locales, baseLocale } from "./src/paraglide/runtime.js";
|
||||
|
||||
const OUTPUT_DIR = "_site";
|
||||
|
||||
// GitHub Pages project sites are served under /<repo-name>/, not at the
|
||||
// domain root — set BASE_PATH (no trailing slash, e.g. "/gwada-sirius")
|
||||
// in CI to prefix internal links and Vite's own asset URLs accordingly.
|
||||
// Left empty for local dev and for a future custom-domain deployment.
|
||||
const BASE_PATH = (process.env.BASE_PATH || "").replace(/\/+$/, "");
|
||||
|
||||
// Vite's build wipes the output dir (emptyOutDir) after 11ty has already
|
||||
// copied passthrough assets into it — re-copy them once Vite is done.
|
||||
// https://github.com/11ty/eleventy-plugin-vite/issues/42
|
||||
@@ -42,6 +48,7 @@ export default function (eleventyConfig) {
|
||||
"/src": path.resolve(".", "src"),
|
||||
},
|
||||
},
|
||||
base: BASE_PATH ? `${BASE_PATH}/` : "/",
|
||||
build: {
|
||||
emptyOutDir: false,
|
||||
},
|
||||
@@ -65,11 +72,19 @@ export default function (eleventyConfig) {
|
||||
eleventyConfig.addGlobalData("baseLocale", baseLocale);
|
||||
eleventyConfig.addGlobalData("currentYear", () => new Date().getFullYear());
|
||||
|
||||
eleventyConfig.addGlobalData("basePath", BASE_PATH);
|
||||
|
||||
eleventyConfig.addFilter("localeHref", (pagePath, locale) => {
|
||||
const clean = pagePath.replace(/^\/+/, "");
|
||||
return locale === baseLocale ? `/${clean}` : `/${locale}/${clean}`;
|
||||
const localePath = locale === baseLocale ? `/${clean}` : `/${locale}/${clean}`;
|
||||
return BASE_PATH + localePath;
|
||||
});
|
||||
|
||||
// For static/passthrough assets referenced by absolute path outside of
|
||||
// Vite's own bundling (favicon, manifest, service worker, font preloads —
|
||||
// anything marked vite-ignore in layouts/base.njk).
|
||||
eleventyConfig.addFilter("withBase", (assetPath) => BASE_PATH + assetPath);
|
||||
|
||||
eleventyConfig.addFilter("dump", (value) => JSON.stringify(value).replace(/</g, "\\u003c"));
|
||||
|
||||
eleventyConfig.addFilter("formatDate", (isoDate, locale, options = {}) => {
|
||||
|
||||
@@ -2,11 +2,11 @@
|
||||
"name": "Sirius en Guadeloupe — Wep Ronpet",
|
||||
"short_name": "Sirius Gwada",
|
||||
"description": "Lever héliaque de Sirius en Guadeloupe : astronomie, culture et observation.",
|
||||
"start_url": "/",
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"background_color": "#141a33",
|
||||
"theme_color": "#141a33",
|
||||
"icons": [
|
||||
{ "src": "/favicon.svg", "sizes": "any", "type": "image/svg+xml" }
|
||||
{ "src": "favicon.svg", "sizes": "any", "type": "image/svg+xml" }
|
||||
]
|
||||
}
|
||||
|
||||
@@ -5,15 +5,15 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ pageTitle }} — {{ "meta_title" | t(locale) }}</title>
|
||||
<meta name="description" content="{{ 'meta_description' | t(locale) }}">
|
||||
<link vite-ignore rel="icon" href="/favicon.svg" type="image/svg+xml">
|
||||
<link vite-ignore rel="manifest" href="/manifest.webmanifest">
|
||||
<link vite-ignore rel="icon" href="{{ '/favicon.svg' | withBase }}" type="image/svg+xml">
|
||||
<link vite-ignore rel="manifest" href="{{ '/manifest.webmanifest' | withBase }}">
|
||||
|
||||
{% for loc in locales %}
|
||||
<link vite-ignore rel="alternate" hreflang="{{ loc }}" href="{{ slug | localeHref(loc) }}">
|
||||
{% endfor %}
|
||||
|
||||
<link vite-ignore rel="preload" href="/assets/fonts/fraunces-variable.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link vite-ignore rel="preload" href="/assets/fonts/atkinson-400.woff2" as="font" type="font/woff2" crossorigin>
|
||||
<link vite-ignore rel="preload" href="{{ '/assets/fonts/fraunces-variable.woff2' | withBase }}" as="font" type="font/woff2" crossorigin>
|
||||
<link vite-ignore rel="preload" href="{{ '/assets/fonts/atkinson-400.woff2' | withBase }}" as="font" type="font/woff2" crossorigin>
|
||||
<link rel="stylesheet" href="/src/styles/app.css">
|
||||
</head>
|
||||
<body>
|
||||
@@ -29,7 +29,7 @@
|
||||
|
||||
<script>
|
||||
if ("serviceWorker" in navigator) {
|
||||
window.addEventListener("load", () => navigator.serviceWorker.register("/sw.js"));
|
||||
window.addEventListener("load", () => navigator.serviceWorker.register("{{ '/sw.js' | withBase }}"));
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user