LegacyFileOptions<sync>

Совместимость (SASS_PATH):

Dart Sass

с версии 1.15.0

Node Sass

с версии 3.9.0

➤

Эта массив строк опция предоставляет пути загрузки для Sass, чтобы найти стили. Более ранние пути загрузки будут иметь приоритет перед более поздними.

sass.renderSync({
file:"style.scss",
includePaths: ["node_modules/bootstrap/dist/css"]
});
Copy

Пути загрузки также загружаются из переменной окружения SASS_PATH, если она задана. Эта переменная должна быть списком путей, разделенных ; (в Windows) или : (в других операционных системах). Пути загрузки из опции includePaths имеют приоритет над путями загрузки из SASS_PATH.

$SASS_PATH=node_modules/bootstrap/dist/csssassstyle.scssstyle.css
Copy

Совместимость:

Dart Sass

с 1.39.0

Node Sass

✗

По умолчанию, если документ CSS содержит не-ASCII символы, Sass добавляет объявление @charset (в режиме расширенного вывода) или метку порядка байтов (в режиме сжатия) для указания кодировки браузерам или другим потребителям. Если charset установлено в false, эти аннотации опускаются.

Совместимость:

Dart Sass

✓

Node Sass

с 3.0.0

Определяет, будут ли пробелы или табуляции использоваться для отступов в сгенерированном CSS.

constresult = sass.renderSync({
file:"style.scss",
indentType:"tab",
indentWidth:1
});

result.css.toString();
// "h1 {\n\tfont-size: 40px;\n}\n"
Copy

Значение по умолчанию

'space'

Совместимость:

Dart Sass

✓

Node Sass

с 3.0.0

Количество пробелов или табуляций (в зависимости от indentType), используемых на каждой ступени отступа в сгенерированном CSS. Должно быть в диапазоне от 0 до 10 (включительно).

Значение по умолчанию

2

Совместимость:

Dart Sass

✓

Node Sass

с 3.0.0

Последовательность символов, используемая в конце каждой строки сгенерированного CSS. Может принимать следующие значения:

• 'lf' использует U+000A LINE FEED.
• 'lfcr' использует U+000A LINE FEED и U+000D CARRIAGE RETURN.
• 'cr' использует U+000D CARRIAGE RETURN.
• 'crlf' использует U+000D CARRIAGE RETURN и U+000A LINE FEED.

Значение по умолчанию

'lf'

Стиль вывода скомпилированного CSS. Доступны четыре стиля вывода:

• "expanded" (по умолчанию для Dart Sass) записывает каждый селектор и объявление на отдельной строке.

• "compressed" удаляет как можно больше дополнительных символов и записывает весь стилизованный лист на одной строке.

• "nested" (по умолчанию для Node Sass, не поддерживается Dart Sass) отступы правил CSS соответствуют вложенности исходного кода Sass.

• "compact" (не поддерживается Dart Sass) помещает каждое правило CSS на отдельной строке.

Пример

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

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

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

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

result = sass.renderSync({
data:source,
outputStyle:"compact"
});
console.log(result.css.toString());
// h1 { font-size: 40px; }
// h1 code { font-face: Roboto Mono; }
Copy

Дополнительные встроенные функции Sass, доступные во всех табличных стилях. Этот параметр принимает объект, ключи которого представляют подписи функций Sass, а значения — LegacyFunctionы. Каждая функция должна принимать те же аргументы, что и её подпись.

Функции принимают подклассы LegacyValue и должны возвращать те же.

Пример

sass.render({
data:`
h1 {
  font-size: pow(2, 5) * 1px;
}`,
functions: {
// This function uses the synchronous API, and can be passed to either
// renderSync() or render().
'pow($base, $exponent)':function(base, exponent) {
if (!(baseinstanceofsass.types.Number)) {
throw"$base: Expected a number.";
      } elseif (base.getUnit()) {
throw"$base: Expected a unitless number.";
      }

if (!(exponentinstanceofsass.types.Number)) {
throw"$exponent: Expected a number.";
      } elseif (exponent.getUnit()) {
throw"$exponent: Expected a unitless number.";
      }

returnnewsass.types.Number(
Math.pow(base.getValue(), exponent.getValue()));
    },

// This function uses the asynchronous API, and can only be passed to
// render().
'sqrt($number)':function(number, done) {
if (!(numberinstanceofsass.types.Number)) {
throw"$number: Expected a number.";
      } elseif (number.getUnit()) {
throw"$number: Expected a unitless number.";
      }

done(newsass.types.Number(Math.sqrt(number.getValue())));
    }
  }
}, function(err, result) {
console.log(result.css.toString());
// h1 {
//   font-size: 32px;
// }
});
Copy

Совместимость:

Dart Sass

✓

Node Sass

с версии 3.0.0

➤

Совместимость (Порядок импорта):

Dart Sass

с версии 1.20.2

Node Sass

✗

➤

Дополнительный(ые) обработчик(и) для загрузки файлов при обнаружении правила @use или правила @import. Это может быть либо единственная функция LegacyImporter, либо массив LegacyImporterов.

Импортеры принимают URL файла @import или правила @use и возвращают LegacyImporterResult, указывающий, как обработать это правило. Для получения более подробной информации см. LegacySyncImporter и LegacyAsyncImporter.

Загрузки разрешаются, пытаясь, в порядке:

• Загрузка файла с диска относительно файла, в котором появилось правило @use или @import.

• Каждый пользовательский импортер.

• Загрузка файла относительно текущей рабочей директории.

• Каждый путь загрузки в includePaths.

• Каждый путь загрузки, указанный в переменной среды SASS_PATH, которая должна быть разделена точкой с запятой в Windows и двоеточием в других операционных системах.

Пример

sass.render({
file:"style.scss",
importer: [
// This importer uses the synchronous API, and can be passed to either
// renderSync() or render().
function(url, prev) {
// This generates a stylesheet from scratch for `@use "big-headers"`.
if (url != "big-headers") returnnull;

return {
contents:`
h1 {
  font-size: 40px;
}`
      };
    },

// This importer uses the asynchronous API, and can only be passed to
// render().
function(url, prev, done) {
// Convert `@use "foo/bar"` to "node_modules/foo/sass/bar".
constcomponents = url.split('/');
constinnerPath = components.slice(1).join('/');
done({
file:`node_modules/${components.first}/sass/${innerPath}`
      });
    }
  ]
}, function(err, result) {
// ...
});
Copy

Совместимость:

Dart Sass

с версии 2.0

Node Sass

✗

Если этот параметр установлен на экземпляр NodePackageImporter, Sass будет использовать встроенный импортер пакетов Node.js для разрешения файлов Sass со схемой URL pkg:. Подробности для авторов библиотек и пользователей можно найти в документации NodePackageImporter.

Пример

sass.renderSync({
data:'@use "pkg:vuetify";',
pkgImporter:newsass.NodePackageImporter()
});
Copy

Набор устаревших функций, которые нужно обрабатывать как критические.

Если при компиляции встречается предупреждение об устаревании любого указанного типа, компилятор выдаст ошибку.

Если указан Version, все предупреждения об устаревании, которые были активны в этой версии компилятора, будут обрабатываться как критические.

Совместимость

dart: "1.78.0", node: false

Набор будущих устаревших функций, для которых нужно включить раннее предупреждение.

Будущие устаревшие функции, указанные здесь, будут обрабатываться компилятором как активные, и по необходимости будут выводиться предупреждения.

Совместимость

dart: "1.78.0", node: false

Совместимость:

Dart Sass

с версии 1.43.0

Node Sass

✗

Объект для обработки предупреждений и/или сообщений отладки Sass.

По умолчанию Sass выводит предупреждения и сообщения отладки в стандартный вывод ошибок, но если установлены warn или debug, они будут вызваны вместо этого.

Специальное значение silent может использоваться для лёгкого отключения всех сообщений.

Совместимость:

Dart Sass

с версии 1.35.0

Node Sass

✗

Если этот параметр установлен в true, Sass не будет выводить предупреждения, вызванные зависимостями. «Зависимость» определяется как любой файл, загруженный через includePaths или importer. Стили, импортированные относительно точки входа, не считаются зависимостями.

Это полезно для отключения предупреждений об устаревании, которые вы не можете исправить самостоятельно. Однако, также уведомляйте свои зависимости об устаревании, чтобы они могли быть исправлены как можно скорее!

Значение по умолчанию

false

Набор активных предупреждений об устаревании, которые нужно игнорировать.

Если при компиляции встречается предупреждение об устаревании любого указанного типа, компилятор проигнорирует его.

Совместимость

dart: "1.78.0", node: false

Совместимость:

Dart Sass

с версии 1.35.0

Node Sass

✗

По умолчанию Dart Sass будет выводить только пять экземпляров одного и того же предупреждения об устаревании за компиляцию, чтобы избежать перегрузки пользователей в консоли. Если установить verbose на true, он будет выводить каждое предупреждение об устаревании, с которым столкнётся.

Значение по умолчанию

false

Если true, Sass не будет добавлять ссылку из сгенерированного CSS на карту источников.

constresult = sass.renderSync({
file:"style.scss",
sourceMap:"out.map",
omitSourceMapUrl:true
})
console.log(result.css.toString());
// h1 {
//   font-size: 40px;
// }
Copy

Значение по умолчанию

false

Местоположение, куда Sass ожидает сохранения сгенерированного CSS. Оно используется для определения URL, используемого для ссылки из сгенерированного CSS на карту источников и из карты источников на файлы исходного кода Sass.

result = sass.renderSync({
file:"style.scss",
sourceMap:true,
outFile:"out.css"
})
console.log(result.css.toString());
// h1 {
//   font-size: 40px;
// }
// /*# sourceMappingURL=out.css.map * /
Copy

Определяет, нужно ли Sass генерировать карту источников. Если нужно, карта источников будет доступна как map (если sourceMapEmbed не true).

Если этот параметр является строкой, это путь, в который ожидается запись карты источников, который используется для ссылки на карту источников из сгенерированного CSS и для ссылки из карты источников на файлы исходного кода Sass. Обратите внимание, что если sourceMap — это строка, и outFile не передано, Sass предполагает, что CSS будет записан в ту же директорию, что и файл-опция, если она передана.

Если этот параметр — true, предполагается путь outFile с .map в конце. Если это true, и outFile не передано, это не имеет эффекта.

Пример

letresult = sass.renderSync({
file:"style.scss",
sourceMap:"out.map"
})
console.log(result.css.toString());
// h1 {
//   font-size: 40px;
// }
// /*# sourceMappingURL=out.map * /

result = sass.renderSync({
file:"style.scss",
sourceMap:true,
outFile:"out.css"
})
console.log(result.css.toString());
// h1 {
//   font-size: 40px;
// }
// /*# sourceMappingURL=out.css.map * /
Copy

Значение по умолчанию

false

Включает ли карту источников полные содержимое файлов Sass, которые повлияли на сгенерированный CSS. Это может привести к очень большим картам источников, но гарантирует, что исходный код будет доступен на любом компьютере, независимо от того, как CSS обслуживается.

Пример

sass.renderSync({
file:"style.scss",
sourceMap:"out.map",
sourceMapContents:true
})
Copy

Значение по умолчанию

false

Включает ли карту источников содержимое файла карты источников в сгенерированный CSS, а не создаёт отдельный файл и ссылается на него из CSS.

Пример

sass.renderSync({
file:"style.scss",
sourceMap:"out.map",
sourceMapEmbed:true
});
Copy

Значение по умолчанию

false

Если указано, оно добавляется перед всеми ссылками из карты источников на файлы исходного кода Sass.