# General Translation Integrations: Añadir formatos de archivo
URL: https://generaltranslation.com/es/docs/integrations/paraglide/guides/adding-file-formats.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: Cómo analizar archivos de componentes en un formato que no cubren los lenguajes integrados.

Los archivos que no son JavaScript, TypeScript ni JSX se convierten a TypeScript mediante un lenguaje: un pequeño adaptador que envuelve las herramientas propias del framework. Añade un lenguaje cuando tu aplicación use mensajes en un formato que no figure entre los [formatos de archivo compatibles](/docs/integrations/paraglide/reference/file-formats).

Los lenguajes son una opción de la biblioteca, así que esta guía usa [`collectContext`](/docs/integrations/paraglide/reference/collect-context) en lugar de la CLI.

## Antes de empezar [#before-start]

Necesitas un compilador o una herramienta de lenguaje para el formato que devuelva:

* El archivo como código JavaScript o TypeScript.
* Un source map, o mapeos de Volar, que relacionen ese código con el archivo original.

El código sin mapeo nunca cuenta como uso, así que los mapeos determinan qué usos se detectan y dónde se corta su contexto.

## Escribe el lenguaje [#write-language]

Un [`SourceLanguage`](/docs/integrations/paraglide/reference/extension-api#languages) declara sus extensiones de archivo y los paquetes que necesita, y devuelve el módulo generado:

```ts title="riot-language.ts"
import {
  mappingsFromSourceMap,
  type SourceLanguage,
} from '@generaltranslation/paraglide-js/compiler';

export const riotLanguage: SourceLanguage = {
  name: 'riot',
  extensions: ['.riot'],
  requires: ['@riotjs/compiler'], // se menciona en la advertencia si falta
  async generate(source, file, context) {
    // Se carga desde la app; undefined si no está instalado.
    const compiler =
      await context.load<typeof import('@riotjs/compiler')>('@riotjs/compiler');
    if (!compiler) return undefined; // se omite

    const { code, map } = compiler.compile(source, { file });
    const mappings = mappingsFromSourceMap(map, code, source);

    return { code, lang: 'js', mappings };
  },
};
```

1. Carga la herramienta con `context.load` para que su versión coincida con la de la aplicación. Devuelve `undefined` si no está disponible: el formato se omite y se emite una única advertencia que indica los paquetes de `requires`.
2. Construye `mappings` con `mappingsFromSourceMap` para un source map de la versión 3, o con `mappingsFromVolar` para el mapeo de una herramienta basada en Volar.
3. Lanza una excepción si la herramienta rechaza un archivo. Ese archivo se omite con una advertencia.

## Registrar el lenguaje [#register-language]

Pásalo junto con los valores predeterminados:

```ts
import {
  collectContext,
  defaultLanguages,
} from '@generaltranslation/paraglide-js/compiler';
import { riotLanguage } from './riot-language.js';

await collectContext({ languages: [...defaultLanguages, riotLanguage] });
```

Los archivos con las extensiones del lenguaje pasan a formar parte del análisis. Si varios lenguajes corresponden a un archivo, se usa el primero de la lista.

## Cubrir scripts y extensiones de script [#scripts]

* **Scripts independientes:** devuelve en `scripts` los scripts que son módulos por sí mismos, como los scripts de cliente de una página de Astro, cada uno con la forma `{ code, lang, mappings }`. No comparten nombres entre sí ni con el `code` principal.
* **Extensiones de script:** para hacerte cargo de archivos con una extensión de script, como hacen los componentes de Angular con `.ts`, añade `detect(source, file)` y devuelve `true` solo para los archivos de tu formato.

## Next steps

- /docs/integrations/paraglide/guides/resolving-imports

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.
