Saltar a contenido
En esta página

Instalación

Verificado en Magento Open Source 2.4.7–2.4.9 · Mage-OS 2.4.7–2.4.9

Los pasos 1 a 6 son la receta que la matriz de versiones ejecuta en cada plataforma listada en Compatibilidad: los paquetes publicados, instalados desde Packagist en una tienda limpia y construidos, seguidos de una verificación rápida del storefront. El paso 7 es el paso de producción y no forma parte de la corrida de la matriz. Con ^4.0, Composer instala los módulos del storefront 4.0.1 y el framework y theme-default 4.0.0. Revisa primero los requisitos. En Adobe Commerce, lee también Instalar en Adobe Commerce.

1. Requerir el tema

mage-obsidian/theme-default trae theme-base, el framework, el harness de Vite y toda la pila de módulos del storefront:

composer require mage-obsidian/theme-default:^4.0

2. Registrar los módulos

bin/magento setup:upgrade

3. Activar el tema

En el Admin, ve a Content › Design › Configuration, edita el scope que quieras y elige MageObsidian — Default (Obsidian) como tema aplicado.

4. Generar el contrato PHP ↔ JS

bin/magento mage-obsidian:frontend:config --generate

5. Preparar el harness de Vite

El harness vite/ debe estar en la raíz de Magento. Si falta vite/package.json, cópialo desde el paquete instalado:

[ -f vite/package.json ] || { rm -rf vite && cp -r vendor/mage-obsidian/component-modern-frontend/vite vite; }

Crea vite/.env a partir de vite/.env.sample con los valores de tu host y luego instala las dependencias de Node tal como están bloqueadas:

cd vite
pnpm install --frozen-lockfile

El .env lleva VITE_SERVER_HOST, VITE_SERVER_PORT, VITE_SERVER_SECURE, VITE_HMR_PATH, MAGENTO_HOST y VITE_SERVER_ALLOWED_HOSTS. Sin él, el build se detiene en una shell no interactiva.

6. Construir el tema

Desde el directorio vite/:

pnpm build:theme MageObsidian/default

7. Desplegar el contenido estático y vaciar la caché

De vuelta en la raíz de Magento:

bin/magento setup:static-content:deploy
bin/magento cache:flush

Abre el storefront: la home se renderiza con sus islas de Vue. Para producción, consulta Despliegue a producción.

Nota: La instalación incluye por defecto el motor Twig opcional (un motor .twig junto a .phtml). No cambia nada de tus plantillas .phtml existentes; si no lo quieres, desactívalo con bin/magento module:disable MageObsidian_ModernFrontendTwig.

Siguientes pasos