问题描述
我按照以下步骤创建了 Spartacus 店面,
- ng new spartacus3
- cd spartacus3
- ng add @spartacus/schematics --baseUrl https://spartacus-demo.eastus.cloudapp.azure.com:8443/ --baseSite=electronics-spa --ssr
- 纱线安装
- 纱线开始
它安装了 Angular 10.2.4 和 Spartacus 3.1。
它编译没有错误。
但是当我使用 URL http://localhost:4200/ 在浏览器中打开相同的屏幕时出现空白屏幕 我在浏览器中验证了网络选项卡,它有有效的响应。 这是网络标签截图 - screenshot - 1,screenshot 2
但是没有一个元素被添加到 DOM 中。 这是元素选项卡屏幕截图 - elements tab screenshot
但在控制台中我有以下信息,
spartacus-storefront.js:17341 No component implementation found for the CMS component type 'ProfileTagScriptComponent'.Make sure you implement a component and register it in the mapper .
我按照下面的链接, https://sap.github.io/spartacus-docs/schematics/#adding-spartacus-core-libraries-and-features-to-your-angular-project
请帮助我在本地运行 Spartacus 应用程序。
下面是我的 app.module.ts 代码,
import { browserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { translations,translationChunksConfig } from '@spartacus/assets';
import { B2cStorefrontModule } from '@spartacus/storefront';
import { StoreFinderRootModule } from '@spartacus/storefinder/root';
import { provideConfig } from '@spartacus/core';
import { storeFinderTranslations } from '@spartacus/storefinder/assets';
import { storeFinderTranslationChunksConfig } from '@spartacus/storefinder/assets';
@NgModule({
declarations: [
AppComponent
],imports: [
browserModule,AppRoutingModule,B2cStorefrontModule.withConfig({
featureModules: {
storeFinder: {
module: () => import('@spartacus/storefinder').then(
(m) => m.StoreFinderModule
),},backend: {
occ: {
baseUrl: 'https://spartacus-demo.eastus.cloudapp.azure.com:8443',prefix: '/occ/v2/'
}
},context: {
currency: ['USD'],language: ['en'],i18n: {
resources: translations,chunks: translationChunksConfig,fallbackLang: 'en'
},features: {
level: '3.0'
}
}),StoreFinderRootModule
],providers: [
provideConfig({
i18n: {
resources: storeFinderTranslations,chunks: storeFinderTranslationChunksConfig,})],bootstrap: [AppComponent]
})
export class AppModule { }
解决方法
一旦在 app.module 中的配置下面添加,那么应用程序就可以正常工作了,
{
provide: ROUTER_CONFIGURATION,useValue: {
scrollPositionRestoration: 'enabled',}
}
Spartacus 版本以上/= 3.2 不需要此代码片段,因为应用程序具有新结构。
,在 app.module.ts 中使用此 baseUrl 链接 baseUrl: 'https://spartacus-training.eastus.cloudapp.azure.com:8443',