Instalación de un plugin de Vite o Rollup

Astro se construye sobre Vite, y soporta tanto plugins de Vite como de Rollup. Esta receta usa un plugin de Rollup para añadir la capacidad de importar un archivo YAML (.yml) en Astro.

Receta

1. Instala @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 --dev

2. Importa el plugin en tu astro.config.mjs y añádelo al array de plugins de Vite:

   astro.config.mjs

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

3. Finalmente, puedes importar datos YAML usando una declaración import:

   import yml from './data.yml';

   Nota

   Aunque ahora puedes importar datos YAML en tu proyecto de Astro, tu editor no proporcionará tipos para los datos importados. Para añadir tipos, crea o busca un archivo *.d.ts existente en el directorio src de tu proyecto y añade lo siguiente:

   src/files.d.ts

   // Specify the file extension you want to import
   declare module "*.yml" {
     const value: any; // Add type definitions here if desired
     export default value;
   }

   Esto permitirá que tu editor proporcione sugerencias de tipos para tus datos YAML.