Installation d'un plugin Vite ou Rollup

Astro se construit au dessus de Vite, et supporte à la fois les plugins Vite et Rollup. Cette recette utilise un plugin Rollup pour ajouter la possibilité d’importer un fichier YAML (.yml) dans Astro.

Recette

Titre de la section Recette

1. Installer @rollup/plugin-yaml:

   npm

   npm install @rollup/plugin-yaml --save-dev

   pnpm

   pnpm add @rollup/plugin-yaml --save-dev

   Yarn

   yarn add @rollup/plugin-yaml --save-dev

2. Importez le plugin dans votre astro.config.mjs et ajoutez-le au tableau des plugins de Vite :

   astro.config.mjs

   import { defineConfig } from 'astro/config';
   import yaml from '@rollup/plugin-yaml';
   
   export default defineConfig({
     vite: {
       plugins: [yaml()]
     }
   });

3. Enfin, vous pouvez importer des données YAML en utilisant une instruction import :

   import yml from './data.yml';

   Note

   Bien que vous puissiez maintenant importer des données YAML dans votre projet Astro, votre éditeur ne fournira pas de types pour les données importées. Pour ajouter des types, créez ou trouvez un fichier *.d.ts existant dans le répertoire src de votre projet et ajoutez ce qui suit :

   src/files.d.ts

   // Spécifiez l'extension du fichier que vous voulez importer
   declare module "*.yml" {
     const value: any; // Ajoutez des définitions de type ici si vous le souhaitez
     export default value;
   }

   Cela permettra à votre éditeur de fournir des indications de type pour vos données YAML.