Magento 2

This extension contains the connector to use Front-Commerce with a headless Magento 2 backend.

Prerequisites

Install the module on Magento.

WIP

https://developers.front-commerce.com/docs/2.x/magento2/installation

Installation

First ensure you have installed the package:

$ pnpm install @front-commerce/magento2@latest

Setup Magento2 Extension

Update your front-commerce.config.ts to include the Magento2 Extension :

front-commerce.config.ts

import { defineConfig } from "@front-commerce/core/config";
import themeChocolatine from "@front-commerce/theme-chocolatine";
import magento2 from "@front-commerce/magento2";
import storesConfig from "./app/config/stores";
import cacheConfig from "./app/config/caching";

export default defineConfig({
  extensions: [magento2({ storesConfig }), themeChocolatine()],
  stores: storesConfig,
  cache: cacheConfig,
  configuration: {
    providers: [],
  },
});

Add the following variables to your .env file:

.env

FRONT_COMMERCE_MAGENTO2_ENDPOINT=https://magento2.example.com
FRONT_COMMERCE_MAGENTO2_CONSUMER_KEY=xxxxxxxxx
FRONT_COMMERCE_MAGENTO2_CONSUMER_SECRET=xxxxxxxxx
FRONT_COMMERCE_MAGENTO2_ACCESS_TOKEN=xxxxxxxxx
FRONT_COMMERCE_MAGENTO2_ACCESS_TOKEN_SECRET=xxxxxxxxx

Feature Flags

The Magento 2 extension supports the following feature flags: Click to expand.

• Cart (default: true) - Enable the cart feature
• Catalog (default: true) - Enable the catalog feature
• Checkout (default: true) - Enable the checkout feature
• Cms (default: true) - Enable the CMS feature
• CmsSearch (default: true) - Enable the CMS search feature
• Contact (default: true) - Enable the contact feature
• Customer (default: true) - Enable the customer feature
• DownloadableProduct (default: true) - Enable the downloadable product feature
• InStockAlert (default: true) - Enable the in stock alert feature
• Invoice (default: true) - Enable the invoice feature
• MagentoAdmin (default: true) - Enable the Magento admin feature
• Order (default: true) - Enable the order feature
• Refund (default: true) - Enable the refund feature
• Reviews (default: true) - Enable the reviews feature
• Store (default: true) - Enable the store feature
• Wishlist (default: true) - Enable the wishlist feature
• Wysiwyg (default: true) - Enable the WYSIWYG feature

All these features are active by default. To disable a feature you should return a falsy value for the feature flag in your extension options:

front-commerce.config.ts

import { defineConfig } from "@front-commerce/core/config";
import themeChocolatine from "@front-commerce/theme-chocolatine";
import magento2 from "@front-commerce/magento2";
import storesConfig from "./app/config/stores";
import cacheConfig from "./app/config/caching";

export default defineConfig({
  extensions: [
    magento2({
      storesConfig
      features: {
        Contact: false, // Contact feature will be disabled
        Refund: false, // Refund feature will be disabled
        Reviews: false, // Reviews feature will be disabled
        // all other features will be enabled by default
      },
    }),
    themeChocolatine(),
  ],
  stores: storesConfig,
  cache: cacheConfig,
  configuration: {
    providers: [],
  },
});

tip

If a feature is not defined in the feature flags, it will be enabled by default.

Disable Health Checks

By default, Front-Commerce enables Health Checks to monitor the availability of the Magento1 backend. These checks run on the FRONT_COMMERCE_MAGENTO2_ENDPOINT URL. If you want to disable these health checks, you can pass the disabled option to your extension configuration.

front-commerce.config.ts

import { defineConfig } from "@front-commerce/core/config";
import magento2 from "@front-commerce/magento2";

export default defineConfig({
  extensions: [
    magento2({
      healthChecks: {
        disabled: true,
      },
    }),
  ],
});

Known issues

Magento 2.4.6: Grouped product options aren't visible

See related issue: https://github.com/magento/magento2/issues/37774

On Magento 2.4.6, Front-Commerce may display a Grouped product with a price of 0€ without any options.

In this version, if products that are part of a grouped product are set to "Not Visible Individually", they won't be returned by Magento when retrieving the grouped product along with its options. Instead, the returned option will be an array of items with product: null.

This issue isn't present in Magento 2.4.5, and as been fixed in Magento 2.4.7-p1.