Usar paquetes npm

Importa cualquier paquete npm que funcione en un navegador y el Estudio de widgets lo descargará por ti. No hay nada que instalar.

import { format } from "date-fns@4";

Consulta primero la biblioteca Blotch. Puede que ya tenga lo que necesitas, dibujado a la medida de la tinta electrónica (e-ink), y así tu widget pesa menos. Para los gráficos, usa los gráficos de la biblioteca en lugar de un paquete de gráficos.

Solo paquetes para navegador

Tu widget se ejecuta en un navegador, así que los paquetes hechos para Node.js, que usan cosas como fs o child_process, no funcionan. Los paquetes que funcionan en ambos entornos no dan problemas.

Fijar la versión

Añade siempre una versión al nombre del paquete. Sin ella, tu widget recibe la versión más reciente cada vez que se dibuja, y una nueva versión mayor del paquete puede romperlo sin previo aviso.

Si escribes	Obtienes	Equivale en package.json a
date-fns@4	La 4.x.x más reciente	^4.0.0
date-fns@4.1	La 4.1.x más reciente	~4.1.0
date-fns@4.1.0	Exactamente la 4.1.0	4.1.0
date-fns	La versión más reciente, sea cual sea	*

También funcionan los paquetes con ámbito y las rutas dentro de un paquete, como @scope/package@2 o package@2/subpath.

Escribe @ después del nombre de un paquete para ver sus versiones. Si el paquete trae tipos, se descargan con él, así que el autocompletado funciona.

Importar por nombre

Importa exportaciones con nombre o la exportación predeterminada:

import { format } from "date-fns@4";
import dayjs from "dayjs@1";

Hay otras dos formas de importar que no se descargan por ti, así que evítalas:

• Las importaciones de espacio de nombres con mayúsculas en el nombre, como import * as Lib from "lib@1". Escríbelas en minúsculas, import * as lib from "lib@1", o importa por nombre.
• Las importaciones que solo buscan efectos secundarios, como import "lib@1".

React

Los widgets siempre usan la versión de React que proporciona Blotch, sea cual sea la versión que importes. Importa React sin versión:

import { useState } from "react";