No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Configuración de TypeScript

8/25
Recursos

Aportes 9

Preguntas 3

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

**Actualización del curso:** Para el componente que utilizamos de HyperUI ya no es necesario hacer la instalación del plugin: `npm install @tailwind/line-clamp` Ahora solo con copiar y pegar el componente funcionara.

Les recomiendo que descarguen la extensión de VSCode para Tailwind, les ayudará mucho a la hora de buscar y seleccionar clases:
https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss

Las clases de este profesor son un dolor de cabeza para mí. Es creo que el único al que no le entiendo lo que explica, no le entiendo el orden ni es claro el fondo de lo que quiere transmitir. Todo lo que indica parece provisional y no transmite cuando algo hace parte dle curso o cuando es un comentario personal sobre algo, no explica cuál es la función de los programas o extensiones que descargamos ni cuál es el concepto general de la extensión o para qué se creó, etc. Debo terminar esta clase para continuar con la ruta pero es una jartera hacerlo. Se ve que el profesor es bien intencionado y quiere enseñar, pero es muy distinto querer hacer algo a en realidad poderlo hacer, no es suficiente la buena intención sino que esta intención debe acompañarse con un resultado que se entrega lo cual aquí no sucede.

Configuración de TypeScript

Por default, Astro esta incorporado para el soporte de TypeScript, lo que nos permite extender de todas las capacidades nativas de dicho lenguaje. Por ejemplo, podemos evitar errores en tiempo de ejecución definiendo las formas de los objetos, componentes o reglas de uso.
.
Esencialmente, no necesitamos escribir nuestros recursos de Astro en TypeScript. Sin embargo, es bueno el recorder que Astro siempre trata nuestros recursos en TypeScript.
.

Astro y TypeScript

Desde su inicialización, Astro nos incluye un archivo de configuración tsconfig.json :

{
  "extends": "astro/tsconfigs/base"
}

Dicha línea, explica que heredaremos una configuración interna de Astro que nos permitirá incluir una serie de directivas predefinidas por la herramienta.
.

📌 Referencia
astro/packages/astro/tsconfigs at main · withastro/astro

.
Adicionalmente, nuestra plantilla incluye una definición de entorno que provee sentido para Vite, del cual también goza Astro como herramienta de compilación.
.

📌 Referencia
Vite

.

Manipulación de configuración TS

Una de las configuraciones opcionales que podemos manipular son los aliases.
.

ℹ️ Definición
Un alias, es un atajo que posee significado en su asignación.

.
En nuestro archivo de configuración de TypeScript, solamente anexamos un bloque de paths para así poder beneficiarnos de los aliases:

{
    "extends": "astro/tsconfigs/strict",
    "compilerOptions": {
        "paths": {
            "@components/*": ["src/components/*"],
            "@layouts/*": ["src/layouts/*"],
            "@pages/*": ["src/pages/*"]
        }
    }
}

Lo que después podamos hacer en nuestros recursos del proyecto:

---
import HelloWorld from '@components/HelloWorld.astro';
import Layout from '@layouts/Layout.astro';
---

sin importar el que escojas usar esto en la terminal
npm install @tailwindcss/line-clamp
y en el codigo require(’@tailwindcss/line-clamp’)

Si optamos por la opción `npx astro add tailwind` que nos instalará la versión mas moderna de tailwind no hay que crear el archivo .cjs porque ya se nos crea uno .mjs que es donde tendremos que pegar la configuración del componente además de no tener que instalar nada mas.
Sería muy bueno que el profesor Diego de Granda pueda rehacer los cursos que ha hecho Oscar para que podamos aprender de los temas que Platzi cree que son importantes.
Me sale este error... alguien me ayuda? ![](https://static.platzi.com/media/user_upload/image-6fb0c88f-cf09-4356-853f-227e80f55575.jpg)