diff --git a/src/content/docs/es/reference/configuration-reference.mdx b/src/content/docs/es/reference/configuration-reference.mdx index 813a99b970d5f..6bae817548378 100644 --- a/src/content/docs/es/reference/configuration-reference.mdx +++ b/src/content/docs/es/reference/configuration-reference.mdx @@ -4,7 +4,7 @@ i18nReady: true --- import Since from '~/components/Since.astro'; -La siguiente referencia cubre todas las opciones de configuración compatibles en Astro. +La siguiente referencia cubre todas las opciones de configuración compatibles en Astro. Para obtener más información sobre cómo configurar Astro, lee nuestra guía sobre [Configurar Astro](/es/guides/configuring-astro/). ```js // astro.config.mjs @@ -112,12 +112,18 @@ Por ejemplo, no puedes tener una redirección `'/article': '/blog/[...slug]'`. ```js -{ +export default defineConfig({ redirects: { - '/old': '/new', - '/blog/[...slug]': '/articles/[...slug]', - } -} + '/old': '/new', + '/blog/[...slug]': '/articles/[...slug]', + '/about': 'https://example.com/about', + '/news': { + status: 302, + destination: 'https://example.com/news' + }, + // '/product1/', '/product1' // Nota: esto no es compatible. + } +}) ``` Para sitios generados estáticamente sin un adaptador instalado, esto producirá una redirección del cliente utilizando una [etiqueta ``](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta#http-equiv) y no admitirá códigos de estado. @@ -147,9 +153,8 @@ Puedes personalizar el [código de estado de redirección](https://developer.moz Especifica el tipo de la compilación. -- `'static'`: Construye un sitio estático para ser implementado en cualquier host estático. -- `'server'`: Construye una aplicación que se implementará en un host compatible con SSR (renderizado en el servidor). -- `'hybrid'` : Construye un sitio estático con algunas páginas renderizadas en el lado del servidor. +- `'static'`: Genera previamente todas tus páginas por defecto, produciendo un sitio completamente estático si ninguna de tus páginas opta por no prerenderizarse. +- `'server'`: Utiliza renderizado del lado del servidor (SSR) para todas las páginas por defecto, generando siempre un sitio renderizado en el servidor. ```js import { defineConfig } from 'astro/config'; @@ -167,9 +172,9 @@ export default defineConfig({ **Tipo:** `AstroIntegration`

-Despliega a tu servidor favorito, serverless o edge host con adaptadores de compilación. Importa uno de nuestros adaptadores propios para [Netlify](/es/guides/deploy/netlify/#adaptador-para-ssr), [Vercel](/es/guides/deploy/vercel/#adaptador-para-ssr), y más para incluir a Astro SSR. +Despliega en tu servidor, entorno serverless o edge host favorito con adaptadores de compilación. Importa uno de nuestros adaptadores propios ([Cloudflare](/es/guides/integrations-guide/cloudflare/), [Netlify](/es/guides/integrations-guide/netlify/), [Node.js](/es/guides/integrations-guide/node/), [Vercel](/es/guides/integrations-guide/vercel/)) o explora [adaptadores de la comunidad](https://astro.build/integrations/2/?search=&categories%5B%5D=adapters) para habilitar el renderizado bajo demanda en tu proyecto Astro. -[Consulta nuestra guía de renderizado en el servidor](/es/guides/on-demand-rendering/) para obtener más información sobre SSR, y [nuestras guías de despliegue](/es/guides/deploy/) para obtener una lista completa de hosts. +Consulta nuestra [guía de renderizado bajo demanda](/es/guides/on-demand-rendering/) para obtener más información sobre las opciones de renderizado en servidor de Astro. ```js import netlify from '@astrojs/netlify'; @@ -188,16 +193,16 @@ import netlify from '@astrojs/netlify'; **Tipo:** `AstroIntegration[]`

-Extiende Astro con integraciones personalizadas. Las integraciones sirven para agregar soporte a frameworks (como Solid.js), nuevas funcionalidades (sitemaps) y nuevas bibliotecas (como Partytown). +Extiende Astro con integraciones personalizadas. Las integraciones son tu solución integral para añadir compatibilidad con frameworks (como Solid.js), nuevas funciones (como mapas del sitio) y nuevas bibliotecas (como Partytown). Consulta nuestra [guía de integraciones](/es/guides/integrations-guide/) para obtener ayuda para comenzar con integraciones de Astro. ```js import react from '@astrojs/react'; -import tailwind from '@astrojs/tailwind'; +import mdx from '@astrojs/mdx'; { - // Ejemplo: Agrega compatibilidad con React + Tailwind a Astro - integrations: [react(), tailwind()], + // Ejemplo: Agrega compatibilidad con React + MDX a Astro + integrations: [react(), mdx()], } ``` @@ -209,7 +214,7 @@ import tailwind from '@astrojs/tailwind'; **Por defecto:** `"."` (carpeta de trabajo actual)

-Solo debes proporcionar esta opción si ejecutas los comandos CLI `astro` en una carpeta que no sea la carpeta raíz del proyecto. Por lo general, esta opción se proporciona a través de la CLI en lugar del [archivo de configuración de Astro](/es/guides/configuring-astro/#tipos-de-archivo-de-configuración-compatibles), ya que Astro necesita conocer la raíz de tu proyecto antes de que pueda localizar su archivo de configuración. +Solo debes proporcionar esta opción si ejecutas los comandos CLI de `astro` en un directorio distinto al directorio raíz del proyecto. Por lo general, esta opción se proporciona a través de la CLI en lugar del archivo de configuración de Astro, ya que Astro necesita conocer la raíz de tu proyecto antes de que pueda localizar su archivo de configuración. Si proporcionas una ruta relativa (p. ej., `--root: './my-project'`), Astro la resolverá en tu directorio de trabajo actual. @@ -301,8 +306,12 @@ El valor puede ser una ruta absoluta del sistema de archivos o una ruta relativa **Por defecto:** `true`

-Esta es una opción para minificar tu salida HTML y reducir el tamaño de tus archivos HTML. Por defecto, Astro elimina todos los espacios en blanco de tu HTML, incluyendo los saltos de línea, en los componentes `.astro`. Esto ocurre tanto en el modo de desarrollo como en la compilación final. -Para desactivar la compresión del HTML, establece el parámetro `compressHTML` en `false`. +Esta es una opción para minificar la salida HTML y reducir el tamaño de tus archivos HTML. + +De forma predeterminada, Astro elimina los espacios en blanco de tu HTML, incluidas las rupturas de línea, de los componentes `.astro` de manera lossless (sin pérdida de información). +Se conservarán algunos espacios en blanco cuando sea necesario para preservar la representación visual de tu HTML. Esto ocurre tanto en el modo de desarrollo como en la compilación final. + +Para desactivar la compresión HTML, establece `compressHTML` en false. ```js { @@ -315,13 +324,13 @@ Para desactivar la compresión del HTML, establece el parámetro `compressHTML`

**Tipo:** `'where' | 'class' | 'attribute'`
**Por defecto:** `'attribute'`
- +

Especifica la estrategia utilizada para delimitar los estilos dentro de los componentes de Astro. Elige entre: - `'where'` - Utilizar selectores `:where`, sin que aumente la especificidad. - `'class'` - Utilizar selectores basados en clases, lo que provoca un aumento de la especificidad de +1. - - `'attribute'` - Utilizar atributos `data-`, sin aumentar la especificidad a +1. + - `'attribute'` - Utilizar atributos `data-`, lo que provoca un aumento de la especificidad de +1. Utilizar `'class'` es útil cuando quieres asegurar que los selectores de elementos dentro de un componente de Astro anulan los valores predeterminados de estilo global (p. ej. de una hoja de estilos global). Utilizar `'where'` te brinda más control sobre la especificidad, pero requiere que utilices selectores de mayor especificidad, capas y otras herramientas para controlar qué selectores se aplican. @@ -330,21 +339,25 @@ Utilizar `'attribute'` es útil cuando estás manipulando el atributo `class` de ### security

-**Tipo:** `boolean`
-**Por defecto:** `{}`
+**Tipo:** `Record<"checkOrigin", boolean> | undefined`
+**Por defecto:** `{checkOrigin: true}`

-Activa medidas de seguridad para un sitio web Astro. +Habilita medidas de seguridad para un sitio web de Astro. + +Estas funciones solo existen para las páginas renderizadas bajo demanda (SSR) usando el modo `server` o para las páginas que optan por no usar el prerenderizado en el modo `static`. -Estas funciones solo existen para páginas renderizadas bajo demanda (SSR) usando el modo `server` o páginas que optan por no prerrenderizarse en modo `hybrid`. +De forma predeterminada, Astro comprobará automáticamente que el encabezado “origin” +coincida con la URL enviada por cada solicitud en las páginas renderizadas bajo demanda. Puedes +desactivar este comportamiento estableciendo `checkOrigin` en `false`: ```js // astro.config.mjs export default defineConfig({ output: "server", security: { - checkOrigin: true + checkOrigin: false } }) ``` @@ -353,7 +366,7 @@ export default defineConfig({

**Tipo:** `boolean`
-**Por defecto:** 'false'
+**Por defecto:** 'true'

@@ -435,17 +448,17 @@ Para evitar inconsistencias con el comportamiento de la barra diagonal final en

**Tipo:** `string`
-**Por defecto:** `'./dist/client'` +**Por defecto:** `'./client'`

-Controla el directorio de salida del CSS y JavaScript del lado del cliente solamente cuando esté configurado `output: 'server'` o `output: 'hybrid'`. +Controla el directorio de salida del CSS y JavaScript del lado del cliente al compilar un sitio web con páginas renderizadas en el servidor. `outDir` controla dónde se compila el código. Este valor es relativo al `outDir`. ```js { - output: 'server', // o 'hybrid' + output: 'server', build: { client: './client' } @@ -456,7 +469,7 @@ Este valor es relativo al `outDir`.

**Tipo:** `string`
-**Por defecto:** `'./dist/server'` +**Por defecto:** `'./server'`

Controla el directorio de salida del JavaScript del servidor cuando compila a SSR. @@ -598,6 +611,34 @@ Controla si los estilos del proyecto se envían al navegador en un archivo CSS s } ``` +### build.concurrency + +

+ +**Tipo:** `number`
+**Por defecto:** `1`
+ +

+ +La cantidad de páginas que se compilan en paralelo. + +**En la mayoría de los casos, no deberías cambiar el valor predeterminado de `1`.** + +Usa esta opción únicamente cuando otros intentos de reducir el tiempo total de renderizado (p. ej. agrupar o almacenar en caché tareas de larga duración como llamadas fetch o acceso a datos) no sean posibles o no resulten suficientes. +Si el número es demasiado alto, el renderizadop de las páginas puede volverse más lento debido a recursos de memoria insuficientes y al hecho de que JavaScript es de un solo hilo (single-threaded). + +```js +{ + build: { + concurrency: 2, + }, +} +``` + + :::caution[Es posible que se produzcan cambios incompatibles] + Esta característica es estable y no se considera experimental. Sin embargo, está pensada únicamente para abordar problemas de rendimiento complejos, y podrían producirse cambios importantes en una [versión menor](/es/upgrade-astro/#versionado-semántico) para mantener esta opción lo más optimizada posible. Por favor, revisa el [CHANGELOG de Astro](https://github.com/withastro/astro/blob/refs/heads/next/packages/astro/CHANGELOG.md) en cada versión menor si utilizas esta característica. + ::: + ## Opciones del Servidor Personaliza el entorno de desarrollo de Astro, utilizado por `astro dev` y `astro preview`. @@ -647,6 +688,26 @@ Si el puerto dado ya está en uso, Astro probará automáticamente el siguiente } ``` +### server.allowedHosts + +

+ +**Tipo:** `Array | true`
+**Por defecto:** `[]`
+ +

+ +Una lista de nombres de host a los que Astro tiene permitido responder. Cuando el valor se establece en `true`, +se permite cualquier nombre de host. + +```js +{ + server: { + allowedHosts: ['staging.example.com', 'qa.example.com'] + } +} +``` + ### server.open

@@ -676,6 +737,149 @@ Pasa un string de URL completo (p. ej. "http://example.com") o una ruta (p. ej. Establece encabezados de respuesta HTTP personalizados para enviar en `astro dev` y `astro preview`. +## Opciones de Sesión + +

+ + +

+ +Configura el almacenamiento de sesión para tu proyecto Astro. Esto se utiliza para almacenar datos de sesión de manera persistente, de modo que se puedan acceder a través de diferentes solicitudes. +Algunos adaptadores pueden proporcionar un driver de sesión predeterminado, pero puedes sobrescribirlo con tu propia configuración. + +Consulta la [guía de sesiones](/es/guides/sessions/) para obtener más información. + +```js title="astro.config.mjs" + { + session: { + // El nombre de el Unstorage driver + driver: 'redis', + // Las opciones requeridas dependen del driver + options: { + url: process.env.REDIS_URL, + }, + ttl: 3600, // 1 hora + } + } +``` + +### session.driver + +

+ +**Tipo:** `string | undefined`
+ +

+ +{/*TODO: add link to /es/guides/integrations-guide/node/#sesiones +/es/guides/integrations-guide/cloudflare/#sesiones /es/guides/integrations-guide/netlify/#sesiones */} +El driver de Unstorage que se utilizará para el almacenamiento de sesiones. Los adaptadores de Node, Cloudflare y +Netlify configuran automáticamente un driver predeterminado para ti, +pero puedes especificar el tuyo propio si lo prefieres o si estás utilizando un adaptador que no proporciona uno. + +El valor es el "nombre del driver" de la [documentación del driver de Unstorage](https://unstorage.unjs.io/drivers). + +```js title="astro.config.mjs" ins={4} +{ + adapter: vercel(), + session: { + driver: "redis", + }, +} +``` +:::note +Algunos drivers pueden necesitar paquetes adicionales para ser instalados. Algunos drivers también pueden requerir que se establezcan variables de entorno o credenciales. Consulta la [documentación de Unstorage](https://unstorage.unjs.io/drivers) para obtener más información. +::: + +### session.options + +

+ +**Tipo:** `Record | undefined`
+**Por defecto:** `{}`
+ +

+ +Las opciones específicas del driver que se utilizarán para el almacenamiento de sesiones. Las opciones dependen del driver que estés utilizando. Consulta la [documentación de Unstorage](https://unstorage.unjs.io/drivers) +para obtener más información sobre las opciones disponibles para cada driver. + +```js title="astro.config.mjs" ins={4-6} +{ + session: { + driver: "redis", + options: { + url: process.env.REDIS_URL + }, + } +} +``` + +### session.cookie + +

+ +**Tipo:** `string | AstroCookieSetOptions | undefined`
+**Por defecto:** `{ name: "astro-session", sameSite: "lax", httpOnly: true, secure: true }`
+ +

+ +La configuración de la cookie de sesión. Si se establece como una cadena, se utilizará como el nombre de la cookie. +Alternativamente, puedes pasar un objeto con opciones adicionales. Estas se fusionarán con los valores predeterminados. + +```js title="astro.config.mjs" ins={3-4} +{ + session: { + // Si se establece como una cadena, se utilizará como el nombre de la cookie. + cookie: "my-session-cookie", + } +} + +``` + +```js title="astro.config.mjs" ins={4-8} +{ + session: { + // Si se establece como un objeto, se utilizará como las opciones de la cookie. + cookie: { + name: "my-session-cookie", + sameSite: "lax", + secure: true, + } + } +} + ``` + +### session.ttl + +

+ +**Tipo:** `number | undefined`
+**Por defecto:** {Infinity}
+ +

+ +Un período de expiración de tiempo de vida predeterminado opcional para los valores de sesión, en segundos. + +Por defecto, los valores de sesión persisten hasta que se eliminan o se destruye la sesión, y no expiran automáticamente porque ha pasado una cantidad particular de tiempo. +Establece `session.ttl` para agregar un período de expiración predeterminado para tus valores de sesión. Pasar una opción `ttl` a [`session.set()`](/es/reference/api-reference/#set) sobrescribirá el valor predeterminado global +para esa entrada individual. + +```js title="astro.config.mjs" ins={3-4} +{ + session: { + // Establecer un período de expiración predeterminado de 1 hora (3600 segundos) + ttl: 3600, + } +} +``` +:::note +Establecer un valor para `ttl` no elimina automáticamente el valor del almacenamiento después de que ha pasado el límite de tiempo. + +Los valores del almacenamiento solo se eliminarán cuando haya un intento de acceder a ellos después de que haya expirado el período de `ttl`. En este momento, el valor de la sesión será indefinido y solo entonces se eliminará el valor. + +Los drivers individuales también pueden admitir una opción `ttl` que eliminará automáticamente las sesiones después del tiempo especificado. Consulta la documentación del driver que elegiste para obtener más información. +::: + ## Opciones de la barra de herramientas de desarrollo ### devToolbar.enabled @@ -762,20 +966,21 @@ Puedes reemplazar este valor predeterminado y seleccionar una estrategia diferen

-**Tipo:** `string`
-**Por defecto:** `undefined`
+**Tipo:** `Object`
+**Por defecto:** `{route: '/_image', entrypoint: undefined}`

-Configura el endpoint a utilizar para la optimización de imágenes en desarrollo y SSR. Establece `undefined` para utilizar el endpoint por defecto. - -El endpoint siempre se inyectará en `/_image`. +Configura el endpoint que se usará para la optimización de imágenes en desarrollo y SSR. La propiedad `entrypoint` se puede establecer en `undefined` para usar el endpoint de imágenes predeterminado. ```js { image: { - // Ejemplo: Usa un endpoint de imagen personalizado - endpoint: './src/image-endpoint.ts', + // Ejemplo: usar un endpoint de imagen personalizado en /custom_endpoint + endpoint: { + route: '/custom_endpoint', + entrypoint: 'src/my_endpoint.ts', + }, }, } ``` @@ -826,7 +1031,7 @@ Establece `false` para omitir el límite de tamaño de imagen por defecto para e

**Tipo:** `Array.`
-**Por defecto:** `{domains: []}`
+**Por defecto:** `[]`

@@ -849,7 +1054,7 @@ Esta opción require un arreglo de nombres de dominio individuales como strings.

**Tipo:** `Array.`
-**Por defecto:** `{remotePatterns: []}`
+**Por defecto:** `[]`

@@ -882,6 +1087,79 @@ Puedes usar comodines para definir los valores `hostname` y `pathname` permitido - Terminar con '/**' para permitir todas las sub-rutas ('startsWith'). - Terminar con '/*' para permitir solo un nivel de sub-ruta. +### image.responsiveStyles + +

+ +**Tipo:** `boolean`
+**Por defecto:** `false`
+ +

+ +Si agregar automáticamente estilos globales para imágenes responsivas. Debes habilitar esta opción a menos que estés aplicando tus propios estilos a las imágenes. + +Esta opción solo se utiliza cuando `layout` está configurado como `constrained`, `full-width` o `fixed`, ya sea mediante la configuración o usando la propiedad `layout` en el componente de imagen. + +{/* TODO: Add link to the Images guide (#responsive-image-styles) in Spanish when available */} +Consulta la documentación de imágenes para más información. + +### image.layout + +

+ +**Tipo:** `ImageLayout`
+**Por defecto:** `undefined`
+ +

+ +El tipo de diseño predeterminado para imágenes responsivas. Puede ser sobrescrito mediante la propiedad `layout` en el componente de imagen. +- `constrained` - La imagen se escalará para ajustarse al contenedor, manteniendo su relación de aspecto, pero no superará las dimensiones especificadas. +- `fixed` - La imagen mantendrá sus dimensiones originales. +- `full-width` - La imagen se escalará para ajustarse al contenedor, manteniendo su relación de aspecto. + +Consulta [la propiedad `layout` del componente](/es/reference/modules/astro-assets/#layout) para más detalles. + +### image.objectFit + +

+ +**Tipo:** `ImageFit`
+**Por defecto:** `"cover"`
+ +

+ +El [valor de la propiedad CSS `object-fit`](https://developer.mozilla.org/es/docs/Web/CSS/object-fit) para imágenes responsivas. Puede ser sobrescrito mediante la propiedad `fit` en el componente de imagen. +Requiere que se haya establecido un valor para `layout`. + +Consulta [la propiedad `fit` del componente](/es/reference/modules/astro-assets/#fit) para más detalles. + +### image.objectPosition + +

+ +**Tipo:** `string`
+**Por defecto:** `"center"`
+ +

+ +El valor predeterminado de la [propiedad CSS `object-position`](https://developer.mozilla.org/es/docs/Web/CSS/object-position) para imágenes responsivas. Puede ser sobrescrito mediante la propiedad `position` en el componente de imagen. +Requiere que se haya establecido un valor para `layout`. + +Consulta [la propiedad `position` del componente](/es/reference/modules/astro-assets/#position) para más detalles. + +### image.breakpoints + +

+ +**Tipo:** `Array.`
+**Por defecto:** `[640, 750, 828, 1080, 1280, 1668, 2048, 2560] | [640, 750, 828, 960, 1080, 1280, 1668, 1920, 2048, 2560, 3200, 3840, 4480, 5120, 6016]`
+ +

+ +Los puntos de interrupción utilizados para generar imágenes responsivas. Requiere que se haya establecido un valor para `layout`. La lista completa normalmente no se usa, +sino que se filtra según el tamaño de origen y de salida. Los valores predeterminados utilizados dependen de si se emplea un servicio de imágenes local o remoto. Para los servicios remotos, +se utiliza la lista más completa, ya que solo se generan los tamaños necesarios. Para los servicios locales, la lista es más corta para reducir la cantidad de imágenes generadas. + ## Opciones de Markdown ### markdown.shikiConfig @@ -890,18 +1168,60 @@ Puedes usar comodines para definir los valores `hostname` y `pathname` permitido **Tipo:** `Partial`

-Opciones de configuración de Shiki. Consulta [la documentación de configuración de Markdown](/es/guides/markdown-content/#configuración-de-shiki) para conocer su uso. +Shiki es nuestro resaltador de sintaxis predeterminado. Puedes configurar todas las opciones a través del objeto `markdown.shikiConfig`: + +```js title="astro.config.mjs" +import { defineConfig } from 'astro/config'; + +export default defineConfig({ + markdown: { + shikiConfig: { + // Elige entre los temas integrados de Shiki (o agrega los tuyos propios) + // https://shiki.style/themes + theme: 'dracula', + // Alternativamente, proporciona múltiples temas + // Consulta la nota más abajo sobre el uso de temas claros/oscuros duales + themes: { + light: 'github-light', + dark: 'github-dark', + }, + // Deshabilitar los colores predeterminados + // https://shiki.style/guide/dual-themes#without-default-color + // (Añadido en v4.12.0) + defaultColor: false, + // Agregar lenguajes personalizados + // Nota: Shiki incluye muchísimos lenguajes integrados, ¡incluido .astro! + // https://shiki.style/languages + langs: [], + // Agregar alias personalizados para lenguajes + // Mapear un alias a un ID de lenguaje de Shiki: https://shiki.style/languages#bundled-languages + // https://shiki.style/guide/load-lang#custom-language-aliases + langAlias: { + cjs: "javascript" + }, + // Habilitar el ajuste de línea para evitar el desplazamiento horizontal + wrap: true, + // Agregar transformadores personalizados: https://shiki.style/guide/transformers + // Encuentra transformadores comunes: https://shiki.style/packages/transformers + transformers: [], + }, + }, +}); +``` + +Consulta la [guía de resaltado de sintaxis de código](/es/guides/syntax-highlighting/) para ver su uso y ejemplos. ### markdown.syntaxHighlight

-**Tipo:** `'shiki' | 'prism' | false`
-**Por defecto:** `shiki` +**Tipo:** `SyntaxHighlightConfig | SyntaxHighlightConfigType | false`
+**Por defecto:** `{ type: 'shiki', excludeLangs: ['math'] }`

-Qué resaltador de sintaxis usar, si lo hay. -- `shiki` - usa el resaltador [Shiki](https://shiki.style) -- `prism` - usa el resaltador [Prism](https://prismjs.com/) +Qué resaltador de sintaxis usar para los bloques de código Markdown (\`\`\`), si es que se usa alguno. Esto determina las clases CSS que Astro aplicará a tus bloques de código en Markdown. + +- `shiki` - usa el resaltador [Shiki](https://shiki.style) (con el tema github-dark configurado por defecto) +- `prism` - usa el resaltador [Prism](https://prismjs.com/) y [proporciona tu propia hoja de estilos de Prism](/es/guides/syntax-highlighting/#agregar-una-hoja-de-estilos-de-prism) - `false` - no aplicar resaltado de sintaxis. ```js @@ -913,6 +1233,45 @@ Qué resaltador de sintaxis usar, si lo hay. } ``` +Para tener más control sobre el resaltado de sintaxis, puedes especificar en su lugar un objeto de configuración con las propiedades que se enumeran a continuación. + +#### markdown.syntaxHighlight.type + +

+ +**Tipo:** `'shiki' | 'prism'`
+**Por defecto:** `'shiki'`
+ +

+ +Las clases CSS predeterminadas que se aplicarán a los bloques de código en Markdown. +(Si no se necesita ninguna otra configuración de resaltado de sintaxis, puedes establecer directamente `markdown.syntaxHighlight` en `shiki`, `prism` o `false`.) + +#### markdown.syntaxHighlight.excludeLangs + +

+ +**Tipo:** `Array`
+**Por defecto:** `['math']`
+ +

+ +Un array de lenguajes a excluir del resaltado de sintaxis predeterminado especificado en `markdown.syntaxHighlight.type`. +Esto puede ser útil al usar herramientas que crean diagramas a partir de bloques de código Markdown, como Mermaid.js y D2. + +```js title="astro.config.mjs" +import { defineConfig } from 'astro/config'; + +export default defineConfig({ + markdown: { + syntaxHighlight: { + type: 'shiki', + excludeLangs: ['mermaid', 'math'], + }, + }, +}); +``` + ### markdown.remarkPlugins

@@ -925,7 +1284,7 @@ Pasa [plugins de remark](https://github.com/remarkjs/remark) para personalizar l import remarkToc from 'remark-toc'; { markdown: { - remarkPlugins: [remarkToc], + remarkPlugins: [ [remarkToc, { heading: "contents"} ] ] } } ``` @@ -1012,32 +1371,31 @@ Configura el enrutamiento i18n y te permite especificar algunas opciones de pers Consulta nuestra guía para obtener más información sobre [la internacionalización en Astro](/es/guides/internationalization/) -### i18n.defaultLocale +### i18n.locales

-**Tipo:** `string`
+**Tipo:** `Locales`

-El idioma predeterminado de tu sitio/aplicación. Este es un campo obligatorio. +Una lista de todos los idiomas admitidos por el sitio web, incluyendo el `defaultLocale`. Este es un campo obligatorio. -Ningún formato o sintaxis de idioma en particular está obligado, pero sugerimos usar minúsculas y guiones según sea necesario (por ejemplo, "es", "pt-br") para una mayor compatibilidad. +Los idiomas pueden enumerarse como códigos individuales (por ejemplo, `['en', 'es', 'pt-br']`) o asignarse a una `ruta` compartida de códigos (por ejemplo, `{ path: "english", code: ["en", "en-US"]}`). Estos códigos se utilizarán para determinar la estructura de URL de tu sitio desplegado. -### i18n.locales +No se impone ningún formato o sintaxis de código de idioma en particular, pero las carpetas de tu proyecto que contengan tus archivos de contenido deben coincidir exactamente con los elementos `locales` de la lista. En caso de que varios `códigos` apunten a un prefijo de ruta URL personalizado, almacena los archivos de contenido en una carpeta con el mismo nombre que la `ruta` configurada. + +### i18n.defaultLocale

-**Tipo:** `Locales`
+**Tipo:** `string`

-Una lista de todos los idiomas admitidos por el sitio web, incluyendo el `defaultLocale`. Este es un campo obligatorio. - -Los idiomas pueden enumerarse como códigos individuales (por ejemplo, `['en', 'es', 'pt-br']`) o asignarse a una `ruta` compartida de códigos (por ejemplo, `{ path: "english", code: ["en", "en-US"]}`). Estos códigos se utilizarán para determinar la estructura de URL de tu sitio desplegado. +La configuración regional predeterminada de tu sitio web o aplicación, que debe ser una de las `locales` especificadas. Este es un campo obligatorio. - -No se impone ningún formato o sintaxis de código de idioma en particular, pero las carpetas de tu proyecto que contengan tus archivos de contenido deben coincidir exactamente con los elementos `locales` de la lista. En caso de que varios `códigos` apunten a un prefijo de ruta URL personalizado, almacena los archivos de contenido en una carpeta con el mismo nombre que la `ruta` configurada. +No se impone un formato o sintaxis de idioma en particular, pero se recomienda usar minúsculas y guiones según sea necesario (p. ej. “es”, “pt-br”) para lograr la mayor compatibilidad. ### i18n.fallback @@ -1074,12 +1432,39 @@ export default defineConfig({

-**Tipo:** `Routing`
+**Tipo:** `object | "manual"`
+**Por defecto:** `object`

Controla la estrategia de enrutamiento para determinar las URLs de tu sitio. Establécelo en función de la configuración de la ruta de la carpeta/URL para tu idioma predeterminado. +```js +export default defineConfig({ + i18n: { + defaultLocale: "en", + locales: ["en", "fr"], + routing: { + prefixDefaultLocale: false, + redirectToDefaultLocale: true, + fallbackType: "redirect", + } + } +}) +``` + +Desde la versión 4.6.0, esta opción también se puede establecer en `manual`. Cuando esta estrategia de enrutamiento está habilitada, Astro **deshabilitará** su middleware de i18n y no se podrán configurar otras opciones de `routing` (p. ej. `prefixDefaultLocale`). Serás responsable de escribir tu propia lógica de enrutamiento o de ejecutar manualmente el middleware de i18n de Astro junto con el tuyo propio. + +```js +export default defineConfig({ + i18n: { + defaultLocale: "en", + locales: ["en", "fr"], + routing: "manual" + } +}) +``` + #### i18n.routing.prefixDefaultLocale

@@ -1097,6 +1482,18 @@ Cuando es `true`, todas las URLs mostrarán un prefijo de idioma. Las URLs serán de la forma `example.com/[lang]/content/` para cada ruta, incluyendo el idioma por defecto. Se utilizan carpetas localizadas para cada idioma, incluido el predeterminado. +```js +export default defineConfig({ + i18n: { + defaultLocale: "en", + locales: ["en", "fr", "pt-br", "es"], + routing: { + prefixDefaultLocale: true, + } + } +}) +``` + #### i18n.routing.redirectToDefaultLocale

@@ -1124,453 +1521,183 @@ export default defineConfig({ }) ``` -#### i18n.routing.manual +#### i18n.routing.fallbackType

-**Tipo:** `string`
- +**Tipo:** `"redirect" | "rewrite"`
+**Por defecto:** `"redirect"`
+

-Cuando esta opción está habilitada, Astro **desactivará** su middleware de internacionalización (i18n) para que puedas implementar tu propia lógica. No se pueden configurar otras opciones de `routing` (Ejemplo: `prefixDefaultLocale`) cuando se utiliza `routing: "manual"`. +{/* TODO: Add link to the Routing guide (#rewrites) in Spanish when available */} +Cuando [`i18n.fallback`](#i18nfallback) está configurado para evitar mostrar una página 404 en rutas de página faltantes, esta opción controla si se debe [redireccionar](/es/guides/routing/#redirecciones) a la página de respaldo o reescribir el contenido de la página de respaldo en el mismo lugar. -Serás responsable de escribir tu propia lógica de enrutamiento o ejecutar manualmente el middleware de internacionalización (i18n) de Astro junto con tu propia implementación. +De forma predeterminada, el enrutamiento i18n de Astro crea páginas que redirigen a tus visitantes a un nuevo destino según tu configuración de fallback. El navegador se actualizará y mostrará la dirección de destino en la barra de direcciones. -```js -export default defineConfig({ - i18n: { - defaultLocale: "en", - locales: ["en", "fr", "pt-br", "es"], - routing: { - prefixDefaultLocale: true, - } - } -}) -``` - -## Banderas legacy - -Para ayudar a algunos usuarios a migrar entre versiones de Astro, ocasionalmente introducimos banderas `legacy`. -Estas banderas te permiten optar por algunos comportamientos desactualizados u obsoletos de Astro -en la última versión, para que puedas continuar actualizando y aprovechar los nuevos lanzamientos de Astro. - -## Banderas Experimentales - -Astro ofrece banderas experimentales para dar a los usuarios acceso temprano a nuevas características. -No se garantiza que estas banderas sean estables. - -### experimental.directRenderScript - -

- -**Tipo:** `boolean`
-**Por defecto:** `false`
- -

- -Permite una estrategia más fiable para evitar que los scripts se ejecuten en páginas en las que no se utilizan. +Cuando se configura `i18n.routing.fallback: "rewrite"`, Astro creará páginas que muestran el contenido de la página de respaldo en la URL original solicitada. -Los scripts se renderizarán directamente como se declaren en los archivos Astro (incluyendo características existentes como TypeScript, importación de `node_modules`, -y la deduplicación de scripts). Ahora también puedes renderizar scripts condicionalmente en tu archivo Astro. -Sin embargo, esto significa que los scripts ya no se colocan en el `` y que varios scripts de una página ya no se empaquetan juntos. -Si activas esta opción, comprueba que todas las etiquetas `