How to override OOB MiniCartCopmponent in Spartacus?

 Override OOB mini cart component:


see the highlighted part in yellow.


I have created separate module called BDIMiniCartModule and ConfigModule.withConfig to override the componentHere MiniCartComponent is OOB component and BDIMinicartComponent is Custom component.


Two other components are created for displaying  list of cart items and cart item.(BDIMiniCartitemListComponent, BDIMinicartItemComponent)

Do not forget to include/import custom module(BDIMiniCartModule )  in app.moduel.ts file.


import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import {
  ConfigModuleI18nModule,

  UrlModule
from '@spartacus/core';
import { CartSharedModuleIconModuleItemCounterModuleMediaModule } from '@spartacus/storefront';
import { BDIMiniCartComponent } from './bdimini-cart.component';
import { BDIMiniCartItemListComponent } from './cart-item-list/bdimini-cart-item-list.component';
import { BDIMiniCartItemComponent } from './cart-item/bdimini-cart-item.component';



@NgModule({
  imports: [CommonModuleRouterModuleUrlModuleIconModuleI18nModule,CartSharedModule,MediaModule,ItemCounterModule,
      ConfigModule.withConfig({
      cmsComponents: {
        MiniCartComponent:{
        component:BDIMiniCartComponent
       },
         }
     })],
  declarations: [BDIMiniCartComponent,BDIMiniCartItemListComponent,BDIMiniCartItemComponent],
  exports: [BDIMiniCartComponent,BDIMiniCartItemListComponent,BDIMiniCartItemComponent],
  entryComponents: [BDIMiniCartComponent],
})
export class BDIMiniCartModule {}

Comments

Popular posts from this blog

Hybris / SAP Commerce Cloud Groovy Scripting Job to Generate CSV/Excel Reports and copy to Commerce cloud Blob Storage

Emma's dream - a kids story - By Kavya

Hybris/ SAP commerce Cloud: Retry failed/not sent emails due to SMTP connection issue.