StackBlitz是一個(gè)WebIDE，可以在瀏覽器里使用SAP Spartacus創(chuàng)建電商網(wǎng)站。

簡(jiǎn)要步驟如下：

在package.json里手動(dòng)添加Spartacus依賴，下圖是添加前StackBlitz創(chuàng)建Angular應(yīng)用后默認(rèn)生成的Angular依賴：

下圖是完整依賴，源代碼附在后面供大家參考：

{"name": "mystore","version": "0.0.0","scripts": {"ng": "ng","start": "ng serve","build": "ng build","test": "ng test","lint": "ng lint","e2e": "ng e2e"},"private": true,"dependencies": {"@angular/animations": "~9.1.12","@angular/common": "~9.1.12","@angular/compiler": "~9.1.12","@angular/core": "~9.1.12","@angular/forms": "~9.1.12","@angular/localize": "~9.1.12","@angular/platform-browser": "~9.1.12","@angular/platform-browser-dynamic": "~9.1.12","@angular/router": "~9.1.12","@angular/service-worker": "~9.1.12","@ng-bootstrap/ng-bootstrap": "^6.0.0","@ng-select/ng-select": "^4.0.0","@ngrx/effects": "~9.1.0","@ngrx/router-store": "~9.1.0","@ngrx/store": "~9.1.0","@spartacus/assets": "^2.1.0","@spartacus/core": "^2.1.0","@spartacus/storefront": "^2.1.0","@spartacus/styles": "^2.1.0","bootstrap": "4.2.1","i18next": "^19.3.4","i18next-xhr-backend": "^3.2.2","ngx-infinite-scroll": "^8.0.0","rxjs": "~6.5.4","tslib": "^1.10.0","zone.js": "~0.10.2"},"devDependencies": {"@angular-devkit/build-angular": "~0.901.12","@angular/cli": "~9.1.12","@angular/compiler-cli": "~9.1.12","@spartacus/schematics": "^2.1.0","@types/jasmine": "~3.5.0","@types/jasminewd2": "~2.0.3","@types/node": "^12.11.1","codelyzer": "^5.1.2","jasmine-core": "~3.5.0","jasmine-spec-reporter": "~4.2.1","karma": "~5.0.0","karma-chrome-launcher": "~3.1.0","karma-coverage-istanbul-reporter": "~2.1.0","karma-jasmine": "~3.0.1","karma-jasmine-html-reporter": "^1.4.2","protractor": "~7.0.0","ts-node": "~8.3.0","tslint": "~6.1.0","typescript": "~3.8.3"} }

依賴安裝完畢后，就可以在StackBlitz的預(yù)覽窗口，查看生成的Spartacus前臺(tái)頁(yè)面了：

要獲取更多Jerry的原創(chuàng)文章，請(qǐng)關(guān)注公眾號(hào)"汪子熙":

總結(jié)

以上是生活随笔為你收集整理的使用StackBlitz和SAP Spartacus快速创建电商店铺页面的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。