实现代码：

import { ModuleWithProviders, NgModule } from '@angular/core';
import {provideConfig,provideDefaultConfig,provideDefaultConfigFactory,
} from '@spartacus/core';
import { CmsLibModule } from '../cms-components/cms-lib.module';
import { StorefrontConfig } from '../storefront-config';
import { layoutConfig, mediaConfig } from './config/index';
import { defaultCmsContentConfig } from './config/static-cms-structure/default-cms-content.config';
import { StorefrontModule } from './storefront.module';@NgModule({imports: [StorefrontModule,// the cms lib module contains all components that added in the bundleCmsLibModule,],providers: [provideDefaultConfig({pwa: {enabled: true,addToHomeScreen: true,},}),provideDefaultConfig(layoutConfig),provideDefaultConfig(mediaConfig),provideDefaultConfigFactory(defaultCmsContentConfig),],exports: [StorefrontModule],
})
export class B2cStorefrontModule {static withConfig(config?: StorefrontConfig): ModuleWithProviders<B2cStorefrontModule> {return {ngModule: B2cStorefrontModule,providers: [provideConfig(config)],};}
}

3个默认配置：

layoutConfig

import { LayoutConfig } from '../../layout/config/layout-config';/*** The layout configuration is used to define the overall layout of the storefront.* The configuration includes the following aspects:* - breakpoint layout (AKA screen layout)* - Page sections slot configuration (i.e. header vs footer)* - page template slot configuration (i.e. landing page template vs PDP page template)* - deferred loading configuration** The page slot configurations is directly related to the data in the backend. If you use the* Spartacus sample-data, you will have an aligned setup. However, if you introduce custom page* templates and/or slots, you most likely need to further adjust or replace this configuration.*/
export const layoutConfig: LayoutConfig = {// deferredLoading: {//   strategy: DeferLoadingStrategy.DEFER,//   intersectionMargin: '50px',// },layoutSlots: {header: {lg: {slots: ['PreHeader','SiteContext','SiteLinks','SiteLogo','SearchBox','SiteLogin','MiniCart','NavigationBar',],},slots: ['PreHeader', 'SiteLogo', 'SearchBox', 'MiniCart'],},navigation: {lg: { slots: [] },slots: ['SiteLogin', 'NavigationBar', 'SiteContext', 'SiteLinks'],},footer: {slots: ['Footer'],},LandingPage2Template: {pageFold: 'Section2B',slots: ['Section1','Section2A','Section2B','Section2C','Section3','Section4','Section5',],},ContentPage1Template: {slots: ['Section2A', 'Section2B'],},CategoryPageTemplate: {pageFold: 'Section2',slots: ['Section1', 'Section2', 'Section3'],},ProductListPageTemplate: {slots: ['ProductLeftRefinements', 'ProductListSlot'],},ProductGridPageTemplate: {slots: ['ProductLeftRefinements', 'ProductGridSlot'],},SearchResultsListPageTemplate: {slots: ['Section2','ProductLeftRefinements','SearchResultsListSlot','Section4',],},SearchResultsGridPageTemplate: {slots: ['Section2','ProductLeftRefinements','SearchResultsGridSlot','Section4',],},ProductDetailsPageTemplate: {lg: {pageFold: 'UpSelling',},pageFold: 'Summary',slots: ['Summary','UpSelling','CrossSelling','Tabs','PlaceholderContentSlot',],},CartPageTemplate: {slots: ['TopContent', 'CenterRightContentSlot', 'EmptyCartMiddleContent'],},AccountPageTemplate: {slots: ['BodyContent', 'SideContent'],},LoginPageTemplate: {slots: ['LeftContentSlot', 'RightContentSlot'],},ErrorPageTemplate: {slots: ['TopContent', 'MiddleContent', 'BottomContent'],},OrderConfirmationPageTemplate: {slots: ['BodyContent', 'SideContent'],},MultiStepCheckoutSummaryPageTemplate: {slots: ['TopContent', 'BodyContent', 'SideContent', 'BottomContent'],},CheckoutLoginPageTemplate: {slots: ['RightContentSlot'],},},
};/*** @deprecated the b2cLayoutConfig will be dropped with version 4.0.** With Spartacus 3.0 we started to align various layout configurations. Moreover, we move* into a pattern where layout configurations are shattered through various (lazy loaded) modules.*/
export const b2cLayoutConfig: LayoutConfig = layoutConfig;

mediaConfig

import { MediaConfig } from '../../shared/components/media/media.config';export const mediaConfig: MediaConfig = {mediaFormats: {mobile: {width: 400,},tablet: {width: 770,},desktop: {width: 1140,},widescreen: {width: 1400,},// product mediacartIcon: {width: 65,},thumbnail: {width: 96,},product: {width: 284,},zoom: {width: 515,},},
};

CmsContentConfig

import { CmsStructureConfig } from '@spartacus/core';
import {defaultPageHeaderConfig,headerComponents,
} from './default-header.config';export function defaultCmsContentConfig(): CmsStructureConfig {return {cmsStructure: {components: {...headerComponents,},slots: {...defaultPageHeaderConfig,},pages: [],},};
}

import { CmsPageSlotsConfig, ContentSlotComponentData } from '@spartacus/core';export const headerComponents: {[key: string]: ContentSlotComponentData | any;
} = {HamburgerMenuComponent: {typeCode: 'HamburgerMenuComponent',flexType: 'HamburgerMenuComponent',},LoginComponent: {typeCode: 'LoginComponent',flexType: 'LoginComponent',uid: 'LoginComponent',},
};export const defaultPageHeaderConfig: CmsPageSlotsConfig = {PreHeader: {componentIds: ['HamburgerMenuComponent'],},SiteLogin: {componentIds: ['LoginComponent'],},
};

SAP Spartacus B2cStorefrontModule里提供的默认配置相关推荐

SAP Spartacus cxOutlet里的元数据存储，outlet名称和待渲染Component的映射关系
cxOutlet合集 SAP Spartacus自定义指令cxOutlet的工作原理 SAP Spartacus table cell如何通过cxOutlet在运行时动态注入组件 SAP Sparta ...
SAP Spartacus cxOutlet 里的 templatesRefs 的填充逻辑
cxOutlet合集 SAP Spartacus自定义指令cxOutlet的工作原理 SAP Spartacus table cell如何通过cxOutlet在运行时动态注入组件 SAP Sparta ...
SAP Spartacus url里默认electronics-spa的由来
单步调试时密切关注url的变化,初始url为localhost:4200: 这个electronics-spa即使在后台没有连通的情况下也能用,说明肯定不是从后台返回的: 这篇文章SAP Sparta ...
如何查看 SAP Spartacus PageLayoutComponent 里的 template$ 的值
SAP Spartacus PageLayoutService.ts 里的 templateName$ get 操作:返回一个 Observable 对象,包裹的类型为 string. pipe 的第 ...
SAP Spartacus store里引用的library是如何编译出来的
看一个基于SAP Spartacus library开发的storefront Angular应用的依赖: "@spartacus/assets": "^2.1.0&qu ...
Django REST framework 源码中提供的默认配置
DEFAULTS 是默认配置,IMPORT_STRINGS 是要相对应导入的类键大写大写大写 ########################### settings.py ########### ...
使用 selector 从 SAP Spartacus state 里读取 Cart 数据
选择器 selector 是用于获取存储状态 state 切片的纯函数. @ngrx/store 提供了一些帮助函数来优化这个选择. 选择器在选择状态切片时提供了许多功能. 使用 createSele ...
SAP Spartacus B2cStorefrontModule 和 StorefrontModule 的区别
这是一个 Recipe module,实现体里包含三个子 module: HttpClientModule StorefrontModule // the cms lib module contain ...
SAP Spartacus PagelayoutComponent里的section和slot
Page包含slots,slots包含Components. Spartacus使用page template来组织slots和Components. 一个page template包含了一些可被全局 ...

SAP Spartacus B2cStorefrontModule里提供的默认配置

layoutConfig

mediaConfig

CmsContentConfig

SAP Spartacus B2cStorefrontModule里提供的默认配置相关推荐

最新文章

热门文章