如果需要使用 SCSS mixin forVersion(3.1) 在單獨庫中引入可選樣式，並希望檢視結果，則 $useLatestStyles 變數需要在本地環境設定為 true.

對於 Spartacus 開發或演示，建議使用最新樣式。

為避免在應用程式中頻繁更改 $minorVersion，我們提供了一個標誌，可用於隨時跟上最新版本。

!default 在 Bootstrap Sass 中經常使用。 它類似於反向 !important。 所有載入程式變數都使用 !default 設定，以允許開發人員進一步自定義載入程式。 使用 !default sass 只會定義尚未設定的變數。

這允許更大的靈活性。

下面是一些例子：

```css
//Example1 Dress color = red
$auroras-dress-color: blue;
$auroras-dress-color: red;

//Example2 Dress color = red
$auroras-dress-color: blue !default;
$auroras-dress-color: red;

//Example3 Dress color = blue
$auroras-dress-color: blue;
$auroras-dress-color: red !default;
```
所以下面這行程式碼的意思是：

```css
$useLatestStyles: false !default;
```

如果使用者沒有定義這個變數，則 `$useLatestStyles` 的值為預設值即 false，如果使用者定義了這個變數的值，則使用使用者定義的值，而忽略 `false` 這個預設值。

這個變數會在 scss 的處理邏輯裡被使用：

![](https://img-blog.csdnimg.cn/img_convert/ee5f000dcb13b22cebc73bc5944b4727.png)

```css
@function isValidVersion($from, $to: 0)
```
最後透過 `mixin` 被外界消費：

```css
@mixin forVersion($from, $to: 0) {
  // We never create content that is part of future releases, this should not really happen.
  @if ($from <= $_fullVersion) {
    @if (
      (isStableVersion($from, $to) and isValidVersion($from, $to)) or
        addBreakingChange($from, $to)
    ) {
      @content;
    }
  }
}
```

![](https://img-blog.csdnimg.cn/img_convert/74e40e941eabbd256d382ed466f7dc13.png)

同樣的邏輯還有另一個變數：`$skipComponentStyles`

![](https://img-blog.csdnimg.cn/img_convert/ad800afac8c4dffc59de80aefca2ed7a.png)

當且僅當一個 selector 沒有定義在變數 `$skipComponentStyles` 裡時，才執行第 25 行的 extend 操作。

下面是 Spartacus style 庫的 app.scss 檔案：

![](https://img-blog.csdnimg.cn/img_convert/72d52ac4ca8224549a82239e4476acc9.png)

對於 feature library style 比如下圖的 `cart` style 而言，不應用直接 import 這個 app.scss, 否則會導致客戶在 `style.scss` 裡自定義的樣式會被覆蓋掉。

![](https://img-blog.csdnimg.cn/img_convert/1cc11ef43c4e728fa99fd6a7f61b15d1.png)

Spartacus CSS layout：在繪製 padding, margin 和 font-sizes 時，應該使用 rem 而不是 px.

https://github.com/SAP/spartacus/issues/15380

SAP Spartacus 4.0 不支援 Angular 13.

使用下列命令列指定使用 Angular 12 進行 Spartacus 安裝：

> npx -p @angular/cli@12 ng new appname --style=scss --routing false

OData 服務的實現分為 OData 資料模型的定義和圍繞這些資料模型的 CRUD(增刪改查) 操作的實現和 Action(function import) 的實現。

- 資料模型的定義：這部分開發工作，定義 OData 包含哪些實體型別(EntityType)，每個型別的名稱，key 欄位和普通欄位的名稱，以及這些欄位的資料型別，是否能夠為 null(透過 nullable 屬性控制)，是否允許修改等等。資料模型的定義，體現在 OData 後設資料裡。開發人員可以在瀏覽器裡很方便的獲得 XML 或者 JSON 格式的 OData 後設資料(在 OData 服務 url 後加上引數 `$metadata`)，並儲存到本地。下圖是儲存到本地的 XML 格式的 OData 後設資料。

![](https://img-blog.csdnimg.cn/img_convert/d49bde1411e3e48d9bb21d49d5bd6160.png)

- 圍繞資料增刪改查和包含業務邏輯的 Action 的實現。這些實現的語言可以是 ABAP，Java，Node.js 等程式語言。Action 定義在資料模型上，比如訂單模型上可以有一個 Release 或者 Approve 的 Action，這些 Action 的程式碼，編寫在 OData 所謂 `Function Import` 裡面。

對於一個 OData 服務來說，一旦資料模型定義完畢，就可以生成後設資料了，不需要等到增刪改查和 Action 實現完畢。

關於 SAP Spartacus scss 處理邏輯裡的變數 $useLatestStyles

相關文章