StringOptionsWithImporter<sync>

可以傳遞給 compileStringcompileStringAsync 的選項。

如果傳遞了 importer 欄位,則 entrypoint 檔案會使用它來載入相對於它本身的檔案,而且 url 欄位是 必要的。

類型參數

階層

輸入

importer: Importer<sync> | FileImporter<sync>

用於處理相對於入口點樣式表的載入的導入器 

相對載入的 URL 首先會相對於 url 解析,然後傳遞給 importer。如果匯入器無法辨識,則會傳遞給 importersloadPaths

loadPaths?: 字串[]

尋找由規則載入的樣式表的路徑,例如 @use@import

載入路徑 loadPath 等於下列 FileImporter

{
findFileUrl(url) {
// Load paths only support relative URLs.
if (/^[a-z]+:/i.test(url)) return null;
return new URL(url, pathToFileURL(loadPath));
}
}
syntax?: Syntax

用於解析入口點樣式表的 Syntax 

預設

'scss'

url: URL

入口樣式表的標準 URL。如果這與 importer 一起傳遞,它用於解析入口樣式表中的相對載入 

輸出

charset?: boolean
相容性
Dart Sass
自 1.54.0
Node Sass

如果為 true,編譯器可能會在輸出非 ASCII CSS 時加上 @charset "UTF-8"; 或 U+FEFF(位元組順序標記)。

如果為 false,編譯器永遠不會發出這些位元組序列。在串接或嵌入 HTML <style> 標籤時,這是理想的選擇。(輸出仍會是 UTF-8。)

預設值

true

sourceMap?: boolean

Sass 是否應產生原始碼對應。如果產生,原始碼對應將可用於 sourceMap

⚠️ 注意!

Sass 不會自動將 sourceMappingURL 註解新增到產生的 CSS 中。呼叫者必須自行執行此操作,因為呼叫者完全知道 CSS 和原始碼對應將如何彼此關聯,以及如何將它們提供給 瀏覽器。

預設值

false

sourceMapIncludeSources?: 布林值

Sass 是否應在產生的來源中包含來源 map。

如果 sourceMapfalse,則此選項無效。

預設值

false

style?: OutputStyle

已編譯 CSSOutputStyle

範例

const source = `
h1 {
font-size: 40px;
code {
font-face: Roboto Mono;
}
}`;

let result = sass.compileString(source, {style: "expanded"});
console.log(result.css.toString());
// h1 {
// font-size: 40px;
// }
// h1 code {
// font-face: Roboto Mono;
// }

result = sass.compileString(source, {style: "compressed"})
console.log(result.css.toString());
// h1{font-size:40px}h1 code{font-face:Roboto Mono}

外掛程式

函數?: 記錄<字串, 自訂函數<同步>>

所有樣式表中可用的其他內建 Sass 函數。此選項會採用一個物件,其金鑰是 Sass 函數簽章,就像您為 @function 規則 所寫的,而其值是 自訂函數

函數會傳遞 的子類別,且必須傳回相同類別。如果傳回值包含 Sass 計算,則會在傳回之前將其簡化。

在撰寫自訂函數時,務必讓它們盡可能地對使用者友善,且盡可能接近 Sass 核心函數所設定的標準。以下是一些不錯的準則

  • 使用 Value.assert* 方法,例如 assertString,將未輸入類型的 物件轉換為更具體的類型。對於直接作為引數傳遞的值,也請傳入引數名稱。這可確保使用者在傳入錯誤的類型至您的函數時,會收到良好的錯誤訊息。

  • 個別類別可能會有更具體的 assert* 方法,例如 assertInt,應盡可能使用這些方法。

  • 在 Sass 中,每個值都算是一個清單。您不應嘗試偵測 Sass 清單 類型,而應使用 asList 將所有值視為清單。

  • 在處理具有元資料(逗號與空格分隔、括號與非括號、引號與非引號、單位)的清單、字串和數字等值時,輸出元資料應與輸入元資料相符 

  • 如有疑問,清單應預設為逗號分隔,字串應預設為帶引號,數字應預設為 無單位。

  • 在 Sass 中,清單和字串使用從 1 開始的索引,並使用負索引從值的結尾開始索引。函式應遵循這些慣例。 sassIndexToListIndexsassIndexToStringIndex 可用於自動執行此操作 

  • Sass 中的字串索引指的是 Unicode 編碼點,而 JavaScript 字串索引指的是 UTF-16 編碼單位。例如,字元 U+1F60A SMILING FACE WITH SMILING EYES 是單一的 Unicode 編碼點,但在 UTF-16 中表示為兩個編碼單位(0xD83D0xDE0A)。因此,在 JavaScript 中,"a😊b".charCodeAt(1) 會傳回 0xD83D,而在 Sass 中,str-slice("a😊b", 1, 1) 會傳回 "😊"。函式應遵循 Sass 的慣例。 sassIndexToStringIndex 可用於自動執行此操作,而 sassLength getter 可用於存取字串在編碼點中的長度 

範例

sass.compileString(`
h1 {
font-size: pow(2, 5) * 1px;
}`, {
functions: {
// Note: in real code, you should use `math.pow()` from the built-in
// `sass:math` module.
'pow($base, $exponent)': function(args) {
const base = args[0].assertNumber('base').assertNoUnits('base');
const exponent =
args[1].assertNumber('exponent').assertNoUnits('exponent');

return new sass.SassNumber(Math.pow(base.value, exponent.value));
}
}
});
importers?: (NodePackageImporter | Importer<sync> | FileImporter<sync>)[]

自訂導入器,用於控制 Sass 如何解析來自規則的載入,例如 @use@import

載入透過嘗試,依序

如果這些都沒有傳回 Sass 檔案,載入會失敗,而 Sass 會擲回 錯誤。

訊息

alertAscii?: 布林值

如果這是 true,編譯器將在錯誤和警告訊息中僅使用 ASCII 字元。否則,它可能會使用非 ASCII Unicode 字元。

預設值

false

alertColor?: 布林值

如果這是 true,編譯器將在錯誤和警告訊息中使用 ANSI 顏色跳脫碼。如果是 false,它將不會使用這些。如果未定義,編譯器將根據使用者是否使用互動式終端來決定是否使用顏色。

logger?: Logger

一個用於處理來自 Sass 的警告和/或偵錯訊息的物件。

預設情況下,Sass 會將警告和偵錯訊息發送到標準錯誤輸出,但如果設定 warndebug,它將會呼叫它們。

特殊值 silent 可用於輕鬆地將所有訊息靜音。

quietDeps?: boolean

如果此選項設定為 true,Sass 將不會列印由相依項產生的警告。相依項定義為透過 loadPathsimporters 載入的任何檔案。相對於進入點匯入的樣式表不被視為相依項。

這對於靜音您無法自行修復的棄用警告很有用。但是,請通知您的相依項有關棄用的資訊,以便它們可以盡快修復!

⚠️ 注意!

如果在未指定 compileStringcompileStringAsyncurl 的情況下呼叫,則它載入的所有樣式表都將被視為相依性。由於它沒有自己的路徑,因此它載入的所有內容都來自載入路徑,而不是相對 匯入。

預設值

false

verbose?: boolean

預設情況下,Dart Sass 每個編譯只會列印同一個不建議使用的警告五次,以避免使用者的主控台訊息過多。如果您將 verbose 設定為 true,它將列印它遇到的每個不建議使用的警告 

預設值

false