MageForge for Magento 2

MageForge is a powerful CLI front-end development toolkit for Magento 2 that simplifies theme development workflows. It provides tools for many types of Magento themes and can be easily extended for your custom theme. With MageForge, themes can be built lightning fast, without your developers having to worry about the details. MageForge eliminates complex configuration requirements and significantly reduces setup time, allowing Magento developers to focus on creative aspects instead of struggling with build processes.

Supported Magento Versions

MageForge requires Magento 2.4.7 or higher. Please ensure that your Magento installation meets this requirement before installation.

Features

Supported Theme-Types 🎨

Theme Type	Support Status
🎯 Magento Standard	✅ Fully Supported
🚀 Hyvä (TailwindCSS 3.x / 4.x)	✅ Fully Supported
🔄 Hyvä Fallback	✅ Fully Supported
🎨 Custom TailwindCSS (no Hyvä)	✅ Fully Supported
💼 Avanta B2B	✅ Fully Supported
🥰 Your Custom Theme (css, sass, less, ... )	Create your own Builder

---

Available Commands

Command	Description	Aliases
mageforge:theme:list	Lists all available themes	frontend:list
mageforge:theme:build	Builds selected themes (CSS/TailwindCSS)	frontend:build
mageforge:theme:watch	Starts watch mode for theme development	frontend:watch
mageforge:theme:clean	Clean theme static files and cache directories	frontend:clean
mageforge:theme:inspector	Enable, disable or check status of Frontend Inspector	-
mageforge:hyva:compatibility:check	Check modules for Hyvä theme compatibility issues	hyva:check
mageforge:hyva:tokens	Generate Hyvä design tokens (Hyvä themes only)	hyva:tokens
mageforge:system:version	Shows current and latest version of the module	system:version
mageforge:system:check	Get system information (OS, PHP, Database, Node.js, etc.)	system:check

Getting Started

Installation

1. Install the module via Composer:

   composer require openforgeproject/mageforge

2. Enable the module:

   bin/magento module:enable OpenForgeProject_MageForge
   bin/magento setup:upgrade

Quick Start Guide

1. List available themes:

   bin/magento mageforge:theme:list

2. Build a theme:

   bin/magento mageforge:theme:build <theme-code>

   Example: bin/magento mageforge:theme:build Magento/luma

3. Start development watch mode:

   bin/magento mageforge:theme:watch <theme-code>

4. Generate Hyvä design tokens (for Hyvä themes):

   bin/magento mageforge:hyva:tokens <theme-code>

   This creates a generated/hyva-tokens.css file from your design tokens configuration.

5. Enjoy automatic CSS rebuilding as you work on your theme files!

---

Frontend Inspector 🕵️

The MageForge Inspector is a powerful developer tool that allows you to inspect Magento blocks, templates, and performance metrics directly in your browser.

Key Features:

• Structure Analysis: View template paths, block classes, and module names for any element.
• Performance Metrics: See PHP render times and cache status (lifetime, tags).
• Web Vitals: Monitor LCP, CLS, and INP metrics per element.
• Accessibility Checks: Inspect ARIA roles, contrast ratios, and alt text.

How to use:

1. Enable the Inspector in the CLI:

   bin/magento mageforge:theme:inspector enable

   (Note: Requires Magento Developer Mode)

2. Enable the Inspector in Magento Admin Settings You can activate the Inspector in Magento Admin under Stores > Configuration > MageForge > Frontend Inspector.

3. Usage in Browser:

   • Toggle: Press Ctrl+Shift+I (Windows/Linux) or Cmd+Option+I (macOS).
   • Inspect: Hover over elements to see details. Click to lock the inspector on a specific block.

To disable the inspector:

bin/magento mageforge:theme:inspector disable

---

Additional Documentation

• Advanced Usage Guide - Tips, tricks and troubleshooting
• Custom Theme Builders Documentation - Extend MageForge for your custom themes
• Commands Documentation - Detailed command reference

Support

• Report Bugs/Features: GitHub Issues
• Discussions: GitHub Discussions
• Contributing: See Contributing Guidelines

Project Information

• License: LICENSE
• Changelog: CHANGELOG

---

Thank you for using MageForge!