The AI Engineer PathEjecutar proyectos de modelos de código abierto localmente
Usa esta página para ejecutar un proyecto Modelos de Código Abierto extraído en tu computadora. El módulo tiene dos tipos de proyecto. Uno ejecuta un modelo de detección de objetos dentro de tu navegador con Transformers.js y necesita un ajuste agregado antes de que se cargue. El otro es un pequeño servidor Express que envía tu pregunta a un modelo en ejecución en Ollama, y su package.json necesita una reparación. Ninguno requiere una clave API.
Lo que necesitas primero
Instala una versión LTS compatible de Node.js. Se recomienda Node 24 e incluye npm. Si Node y npm son nuevos para ti, Ejecutar el código localmente te guía en la instalación y verificación de ambos.
Verifica que ambos comandos funcionen. Tus números de versión pueden ser diferentes:
$ node --version
v24.18.0
$ npm --version
11.18.0El proyecto del navegador también necesita una conexión a internet la primera vez que se carga, porque la página descarga aproximadamente 20 MB de archivos de biblioteca y modelo.
El proyecto de Ollama también necesita Ollama y su modelo mistral, una descarga de aproximadamente 4.4 GB. Comienzas esa descarga en la sección de Ollama más abajo.
node --version y npm --version ambos impriman una versión. No necesitas una clave API para ninguno de los proyectos. Si index.js comienza con import ollama, instala la app Ollama también.
Identifica el proyecto que extrajiste
Abre una terminal en la carpeta extraída. Es la que contiene package.json e index.js:
$ cd path-to-your-extracted-projectAbre index.js y lee su primera línea. El proyecto del navegador, Modelos de IA en el Navegador con Transformers.js, comienza con:
import { pipeline } from 'https://cdn.jsdelivr.net/npm/@xenova/[email protected]'El proyecto de Ollama, Descargar y Ejecutar Modelos de IA en tu Computadora con Ollama, comienza con:
import ollama from "ollama";El proyecto del navegador también tiene index.html y una foto road.jpeg; el proyecto de Ollama no tiene ninguna. Sigue solo la sección del proyecto que tienes.
index.js y mira la primera línea. @xenova/transformers significa el proyecto del navegador; ollama significa el proyecto de Ollama. Luego ve solo a la sección de ese proyecto. Las dos configuraciones no se mezclan.
Ejecuta el proyecto Transformers.js
Instala los paquetes:
$ npm installnpm termina reportando cuántos paquetes agregó.
Antes de iniciarlo, cambia una línea en index.js. Cuando la página se carga, Transformers.js primero busca los archivos del modelo en el mismo servidor que la página, bajo /models/. Vite responde cualquier dirección que no conoce con la página misma, así que la biblioteca recibe HTML donde esperaba la configuración del modelo, y la página se queda en Cargando modelo... para siempre. Un ajuste le dice a Transformers.js que salte esa verificación local y descargue el modelo desde Hugging Face directamente.
Cambia la primera línea de:
import { pipeline } from 'https://cdn.jsdelivr.net/npm/@xenova/[email protected]'a estas dos líneas:
import { pipeline, env } from 'https://cdn.jsdelivr.net/npm/@xenova/[email protected]'
env.allowLocalModels = falseInicia el servidor de desarrollo:
$ npm startVite puede imprimir primero una advertencia que comience con (!) Your Vite config uses features. No detiene la app. Debajo, Vite imprime la dirección a abrir:
VITE v8.3.4 ready in 99 ms
➜ Local: http://localhost:5173/Abre la dirección exacta Local. La página muestra Cargando modelo... encima de un botón Detectar Objetos deshabilitado mientras la biblioteca y el modelo descargan. Cuando el estado cambia a Listo, selecciona Detectar Objetos. Después de unos segundos (hasta aproximadamente veinte en una máquina más lenta) el estado dice ¡Hecho! y aparecen cuadros etiquetados en la foto, como bus: 99%, auto: 97% y varios semáforos. Las cargas posteriores son más rápidas porque el navegador mantiene los archivos descargados.
Si el estado se queda en Cargando modelo... o nunca aparece, abre las herramientas de desarrollador de tu navegador (F12, o Cmd+Option+J en Chrome en una Mac) y lee la pestaña Console; la solución de problemas debajo coincide con cada mensaje. Un 404 rojo para favicon.ico es inofensivo.
Detén el proyecto con Ctrl+C.
npm install, agrega env y la línea env.allowLocalModels = false al principio de index.js, luego ejecuta npm start y abre la dirección Local. Espera a que diga Listo, luego selecciona Detectar Objetos. Cuadros con etiquetas en la foto significan que el modelo funciona.
Repara y ejecuta el proyecto Ollama
Instala Ollama y ábrelo. En macOS y Windows la app inicia el servicio local de Ollama; en Linux el instalador lo configura. Si los comandos ollama dicen que no pueden conectar, ejecuta ollama serve en otra terminal y déjala corriendo.
Descarga el modelo que el código de la lección solicita. Son aproximadamente 4.4 GB, así que puedes hacer las ediciones debajo en otra terminal mientras se descarga:
$ ollama pull mistral
$ ollama lsEl segundo comando debería listar mistral:latest.
Ahora el proyecto mismo. Su package.json fue generado para una página web Vite: npm start ejecuta Vite y el único paquete listado es Vite. Pero index.js es un servidor Node que importa express y ollama. Como se descargó, npm start inicia Vite, y la dirección que imprime muestra HTTP ERROR 404, porque no hay página que servir.
Haz dos ediciones en package.json: agrega "type": "module" y cambia el script start a node index.js. La parte superior del archivo entonces dice:
{
"name": "Scrim-s06c53f",
"description": "https://scrimba.com/ai-engineer-path-c02v/~07uj",
"type": "module",
"scripts": {
"start": "node index.js",
"dev": "vite",Deja el resto del archivo como está. "type": "module" le dice a Node que index.js usa import; sin esto, Node sigue ejecutando el archivo pero imprime una advertencia MODULE_TYPELESS_PACKAGE_JSON primero.
Instala los dos paquetes que index.js importa, luego inicia el servidor:
$ npm install express ollama
$ npm startEl servidor imprime:
Server is running on port 3000Abre http://localhost:3000/. La página debería decir:
Ask something via the `?question=` parameterPregunta solo después de que ollama pull haya terminado. Luego hazle al modelo una pregunta:
http://localhost:3000/?question=Why%20is%20the%20sky%20blue%3FLa respuesta aparece como texto plano una vez que Mistral ha terminado de escribirla. La primera respuesta es la más lenta, porque Ollama carga el modelo en memoria primero; la página no muestra nada hasta entonces.
Detén el servidor con Ctrl+C. Ollama sigue corriendo en el fondo hasta que cierres la app o detengas ollama serve.
ollama pull mistral y mantén Ollama abierto. En package.json, agrega "type": "module" y cambia el script start a node index.js. Luego ejecuta npm install express ollama y npm start, y abre la dirección de pregunta. Una primera respuesta lenta es normal.
Solución de problemas
La página de Transformers.js se queda en Cargando modelo... y la consola dice Unexpected token '<', "<!DOCTYPE "... is not valid JSON: Falta la línea env.allowLocalModels = false, o env no está en la importación. Agrega ambos como se muestra arriba y recarga la página.
La página muestra solo un botón Detectar Objetos deshabilitado sin estado encima, y la consola menciona cdn.jsdelivr.net: La biblioteca no pudo descargar. Un bloqueador de contenido o una red restringida suele ser la causa; permite cdn.jsdelivr.net o intenta otra red.
La página se queda en Cargando modelo... y la consola dice Failed to fetch para huggingface.co: El modelo no pudo descargar. Permite huggingface.co en tu bloqueador de contenido o red, luego recarga.
En el proyecto de Ollama, npm start imprime VITE y su dirección muestra HTTP ERROR 404: El script start sigue ejecutando Vite. Cámbialo a node index.js.
Node dice Cannot find package 'ollama' o Cannot find package 'express': Ejecuta npm install express ollama en la carpeta que contiene package.json.
La dirección de pregunta muestra TypeError: fetch failed, y la terminal muestra ECONNREFUSED 127.0.0.1:11434: Express está corriendo pero Ollama no. Abre la app Ollama o ejecuta ollama serve, luego pregunta de nuevo.
La dirección de pregunta muestra un error diciendo que el modelo mistral no se encuentra: Ollama está corriendo sin el modelo. Ejecuta ollama pull mistral y espera a que termine.
npm start imprime Server is running on port 3000 y luego vuelve al prompt: Otro programa ya usa el puerto 3000. Detenlo, o cambia la constante port en index.js y abre la dirección coincidente.
favicon.ico. Para el proyecto de Ollama, lee qué muestra la dirección de pregunta y qué imprimió la terminal. Luego coincídelo con un encabezado en negrita arriba.