Skip to content

i18n(es): update imports #8984

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
dreyfus92 merged 3 commits into from
Aug 12, 2024
Merged

i18n(es): update imports #8984

Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
f82a7ed
i18n(es): update `imports`
dreyfus92 Aug 2, 2024
55bf54b
add: missing commit reported by @liruifengv
dreyfus92 Aug 10, 2024
7609cbd
Merge branch 'main' into updates-74
dreyfus92 Aug 12, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 9 additions & 17 deletions src/content/docs/es/guides/imports.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,9 @@ Los siguientes tipos de archivos son compatibles por defecto en Astro:
- Componentes de Astro (`.astro`)
- Markdown (`.md`, `.markdown`, etc.)
- JavaScript (`.js`, `.mjs`)
- TypeScript (`.ts`, `.tsx`)
- TypeScript (`.ts`)
- Paquetes NPM
- JSON (`.json`)
- JSX (`.jsx`, `.tsx`)
- CSS (`.css`)
- Módulos CSS (`.module.css`)
- Imágenes & otros archivos (`.svg`, `.jpg`, `.png`, etc.)
Expand All @@ -41,6 +40,13 @@ import { getUser } from './user.js';

Se puede importar JavaScript usando la sintaxis normal ESM `import` & `export`.

:::note[Importando archivos JSX]

Un [UI framework](/es/guides/framework-components/) apropiado ([React](/es/guides/integrations-guide/react/), [Preact](/es/guides/integrations-guide/preact/), o [Solid](/es/guides/integrations-guide/solid-js/)) es necesario para renderizar archivos JSX/TSX.
Utiliza las extensiones `.jsx`/`.tsx` donde sea apropiado, ya que Astro no soporta JSX en archivos `.js`/`.ts`.

:::

### TypeScript

```js
Expand All @@ -64,20 +70,6 @@ import MyComponent from "./MyComponent"; // MyComponent.tsx

<ReadMore>Lee más sobre la compatibilidad de [TypeScript en Astro.](/es/guides/typescript/)</ReadMore>

### JSX / TSX

```js
import { MyComponent } from './MyComponent.jsx';
```

Astro es compatible con archivos JSX (`*.jsx` y `*.tsx`). La sintaxis JSX se transpila automáticamente a JavaScript.

Si bien Astro entiende la sintaxis de JSX por defecto, deberás incluir una integración de framework para renderizar correctamente frameworks como React, Preact y Solid. Consulta nuestra [guía de integraciones](/es/guides/integrations-guide/) para obtener más información.

:::note
**Astro no soporta código JSX en archivos `.js`/`.ts`.** JSX solo es compatible dentro de los archivos que terminen con las extensiones `.jsx` y `.tsx`.
:::

### Paquetes NPM

Si has instalado un paquete de NPM, puedes importarlo en Astro.
Expand Down Expand Up @@ -163,7 +155,7 @@ import logoUrl from '../../assets/logo.png?url';

En este ejemplo, un desarrollador necesitaría comprender la relación de archivos entre `src/pages/about/company.astro`, `src/components/controls/Button.astro` y `src/assets/logo.png?url`. Y luego, si se moviera el archivo `company.astro`, estas importaciones también tendrían que actualizarse.

Puedes agregar alias de importación desde `tsconfig.json` o `jsconfig.json`.
Puedes agregar alias de importación en `tsconfig.json`.

```json title="tsconfig.json" ins={5-6}
{
Expand Down