Point Rouge 6.0

Point Rouge v6 est une réécriture complète basée sur Astro v6, Tailwind CSS v4 et TypeScript v6. Cette version remplace l’ancienne SITE / constants.ts configuration avec un seul fichier de configuration unifié et introduit plusieurs améliorations structurelles dans la base de code.

Point Rouge v6

Table des matières

Changements majeurs

Mise à niveau vers Astro v6

Point Rouge est désormais livré avec Astro v6.3, qui comprend :

API de couche de contenu stable — glob() le chargeur remplace l’ancien type: "content" modèle de collecte.
API de polices stables — experimental.fonts est diplômé d’un niveau supérieur fonts saisir astro.config.ts.
TypeScript v6 - prise en charge complète du dernier compilateur TypeScript.

Nouveau système de configuration unifié

L’appartement SITE objet dans src/config.ts et le séparé constants.ts fichier ont été remplacés par un seul point-rouge.config.ts à la racine du projet. Utiliser definePointRougeConfig() pour IntelliSense complet :

import { definePointRougeConfig } from "./src/types/config";

export default definePointRougeConfig({
  site: {
    url: "https://example.com",
    title: "Point Rouge",
    description: "…",
    author: "Your Name",
    lang: "en",
    timezone: "UTC",
    googleVerification: "your-verification-value",
  },
  posts: {
    perPage: 4,
    perIndex: 4,
    scheduledPostMargin: 15 * 60 * 1000, // ms
  },
  features: {
    lightAndDarkMode: true,
    dynamicOgImage: true,
    showArchives: true,
    showBackButton: true,
    editPost: { enabled: true, url: "https://github.com/…/edit/main/" },
    search: "pagefind",
  },
  socials: [{ name: "github", url: "https://github.com/…" }],
  shareLinks: [{ name: "x", url: "https://x.com/intent/post?url=" }],
});point-rouge.config.ts

Toutes les options (métadonnées du site, pagination, indicateurs de fonctionnalités, liens sociaux et liens de partage) résident désormais dans un seul fichier.

API de polices stables

La configuration des polices est passée de experimental.fonts à un niveau supérieur fonts saisir astro.config.ts, correspondant à l’API stable d’Astro v6 :

export default defineConfig({
  fonts: [
    {
      name: "Google Sans Code",
      cssVariable: "--font-google-sans-code",
      provider: fontProviders.google(),
      weights: [300, 400, 500, 600, 700],
      styles: ["normal", "italic"],
    },
  ],
});astro.config.ts

Prise en charge MDX

@astrojs/mdx est désormais inclus. Les publications peuvent utiliser le .mdx pour intégrer des composants, utiliser des expressions JSX et importer à partir d’autres fichiers. Le modèle de chargeur de contenu **/[^_]*.{md,mdx} récupère automatiquement les deux formats.

Restructuration de la collection de contenu

Les articles de blog ont été déplacés de src/data/blog/ à src/content/posts/, conforme aux conventions Astro. Un nouveau pages collecte à src/content/pages/ couvre les pages autonomes (À propos, etc.). Le posts la collection utilise Astro glob() chargeur - defineCollection avec type: "content" n’est plus utilisé :

const posts = defineCollection({
  loader: glob({ pattern: "**/[^_]*.{md,mdx}", base: "./src/content/posts" }),
  schema: ({ image }) =>
    z.object({
      author: z.string(),
      pubDatetime: z.date(),
      title: z.string(),
      tags: z.array(z.string()).default(["others"]),
      description: z.string(),
      // …
    }),
});src/content.config.ts

Système de jetons de conception

La palette de couleurs à 5 jetons de la v5 est passée à 7 jetons en src/styles/theme.css. Les jetons sont définis en tant que propriétés personnalisées CSS et enregistrés dans Tailwind v4 via @theme inline:

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --color-accent: var(--accent);
  --color-accent-foreground: var(--accent-foreground);
  --color-muted: var(--muted);
  --color-muted-foreground: var(--muted-foreground);
  --color-border: var(--border);
}

:root,
[data-theme="light"] {
  --background: #fdfdfd;
  --foreground: #282728;
  --accent: #006cac;
  --accent-foreground: #ffffff;
  --muted: #e6e6e6;
  --muted-foreground: #6b7280;
  --border: #ece9e9;
}

[data-theme="dark"] {
  --background: #212737;
  --foreground: #eaedf3;
  --accent: #ff6b01;
  --accent-foreground: #ffffff;
  --muted: #343f60;
  --muted-foreground: #afb9ca;
  --border: #ab4b08;
}src/styles/theme.css

theme.css est un fichier distinct importé par global.css. Les deux nouveaux jetons sont --accent-foreground et --muted-foreground.

extraction de chaîne i18n

Toutes les chaînes de l’interface utilisateur sont extraites vers src/i18n/lang/en.ts avec le UIStrings interface. L’ajout d’une nouvelle langue nécessite uniquement un nouveau fichier dans src/i18n/lang/:

export default {
  nav: { home: "Home", posts: "Posts" /* … */ },
  post: { publishedAt: "Published at" /* … */ },
  /* … */
} satisfies UIStrings;src/i18n/lang/en.ts

Le tplStr() helper gère les chaînes paramétrées afin que les traducteurs puissent réorganiser les jetons librement.

Prise en charge du déploiement du chemin de base et du sous-répertoire

Tous les liens internes passent par getRelativeLocaleUrl() et le withBase.ts aides (stripLocale, stripBase, getAssetPath). Déploiement vers un sous-répertoire (par ex. /astro-paper) fonctionne sans mises à jour manuelles des liens.

Vérification du site Google via la configuration

La meilleure façon de configurer la vérification du site Google est site.googleVerification dans point-rouge.config.ts:

export default definePointRougeConfig({
  site: {
    // …
    googleVerification: "your-google-site-verification-value",
  },
});point-rouge.config.ts

Le PUBLIC_GOOGLE_SITE_VERIFICATION La variable d’environnement est toujours prise en charge comme solution de secours dans les cas où vous préférez ne pas valider la valeur dans le fichier de configuration.

PUBLIC_GOOGLE_SITE_VERIFICATION=your-google-site-verification-value.env

Lorsque les deux sont réglés, site.googleVerification a la priorité.

Autres changements notables

Fonctions d’assistance/util mises à jour et renommées.
La navigation dans les articles adjacents (précédent/suivant) est désormais calculée une fois dans getStaticPaths et passé comme accessoire — le composant ne récupère plus toutes les publications par page.
_components/ cadrage : les composants post-spécifiques vivent sous pages/posts/[...slug]/_components/ et ne polluent pas l’environnement mondial src/components/ répertoire.
PostLayout.astro gère uniquement les données structurées et le référencement – la logique de publication de la page réside dans le fichier d’échange lui-même.

Résumé

Point Rouge v6 conserve son aspect minimal et épuré tout en reconstruisant les composants internes autour des nouvelles primitives d’Astro v6. Le système de configuration est plus simple, la base de code est plus facile à naviguer et le thème est livré prêt à l’emploi pour les déploiements i18n et de sous-répertoires.