Предупреждение: срок службы Node Sass истек. Он больше не будет получать выпусков, даже с исправлениями безопасности. Проекты, которые до сих пор используют его, должны перейти на Dart Sass.
Поддерживаемые версии Node.js различаются в зависимости от выпуска, пожалуйста, посетите страницу выпусков.
Версии узлов, срок эксплуатации которых истекает https://github.com/nodejs/Release, будут прекращены из поддержки при каждом выпуске узла (большом, второстепенном).
Мы прекратим создание двоичных файлов для неподдерживаемых выпусков, тестирование на наличие нарушений совместимости зависимостей, но мы не будем блокировать установку для тех, кто хочет поддерживать себя.
Новая версия узла требует незначительных внутренних изменений, а также поддержки со стороны поставщиков CI (AppVeyor, GitHub Actions). Мы откроем один выпуск для желающих подписаться на него и закроем дополнительные выпуски.
Ниже приведено краткое руководство по минимальным и максимальным поддерживаемым версиям node-sass:
NodeJS | Поддерживаемая версия узла-sass | Узловой модуль |
---|---|---|
Узел 20 | 9.0+ | 115 |
Узел 19 | 8.0+ | 111 |
Узел 18 | 8.0+ | 108 |
Узел 17 | 7,0+, <8,0 | 102 |
Узел 16 | 6.0+ | 93 |
Узел 15 | 5,0+, <7,0 | 88 |
Узел 14 | 4,14+, <9,0 | 83 |
Узел 13 | 4,13+, <5,0 | 79 |
Узел 12 | 4,12+, <8,0 | 72 |
Узел 11 | 4,10+, <5,0 | 67 |
Узел 10 | 4,9+, <6,0 | 64 |
Узел 8 | 4.5.3+, <5.0 | 57 |
Узел <8 | <5,0 | <57 |
Он позволяет вам автоматически компилировать файлы .scss в css с невероятной скоростью и автоматически через промежуточное программное обеспечение Connect.
Найдите его на npm: https://www.npmjs.com/package/node-sass.
Следите за обновлениями @nodesass в твиттере: https://twitter.com/nodesass
npm установить узел-дерзость
Некоторые пользователи сообщали о проблемах при установке в Ubuntu из-за регистрации node
в другом пакете. Следуйте официальной документации NodeJS, чтобы установить NodeJS, чтобы #!/usr/bin/env node
разрешался правильно.
Для компиляции на машинах Windows требуются предварительные условия node-gyp.
Вы видите следующую ошибку? Ознакомьтесь с нашим руководством по устранению неполадок.**
SyntaxError: Use of const in strict mode.
Возникли проблемы с установкой? Ознакомьтесь с нашим руководством по устранению неполадок.
npm install -g зеркало-конфигурация-китай --registry=https://registry.npmmirror.com npm установить узел-дерзость
var sass = require('node-sass');sass.render({ файл: scss_filename, [, options..]}, function(err, result) { /*...*/ });// ORvar result = sass.renderSync({ данные: scss_content [, параметры..]});
Тип: String
По умолчанию: null
Специальный : необходимо указать file
или data
.
Путь к файлу для компиляции LibSass.
Тип: String
По умолчанию: null
Специальный : необходимо указать file
или data
.
Строка, передаваемая в LibSass для компиляции. Рекомендуется использовать includePaths
вместе с этим, чтобы LibSass мог находить файлы при использовании директивы @import
.
Это экспериментальная функция LibSass. Используйте с осторожностью.
Тип: Function | Function[]
Функция подписи Function | Function[]
function(url, prev, done)
По умолчанию: undefined
Параметры функции и информация:
url (String)
— путь в импорте как есть , с которым столкнулся LibSass
prev (String)
— ранее разрешенный путь
done (Function)
— функция обратного вызова, вызываемая при асинхронном завершении, принимает литерал объекта, содержащий
file (String)
— альтернативный путь для использования LibSass ИЛИ
contents (String)
— импортируемое содержимое (например, прочитанное из памяти или файловой системы)
Обрабатывает, когда LibSass встречает директиву @import
. Пользовательский импортер позволяет расширять механизм LibSass как синхронно, так и асинхронно. В обоих случаях цель состоит в том, чтобы либо return
, либо вызвать done()
с объектным литералом. В зависимости от значения литерала объекта произойдет одно из двух.
При возврате или вызове метода done()
с помощью { file: "String" }
для @import
будет использоваться новый путь к файлу. Рекомендуется помнить о значении prev
в тех случаях, когда может потребоваться относительное разрешение пути.
При возврате или вызове done()
с помощью { contents: "String" }
строковое значение будет использоваться так, как если бы файл был прочитан через внешний источник.
Начиная с версии 3.0.0:
this
относится к контекстной области для немедленного запуска sass.render
или sass.renderSync
импортеры могут вернуть ошибку, и LibSass выдаст эту ошибку в ответ. Например:
сделано(новая ошибка('не существует!'));// или синхронно возвращаем новую ошибку('здесь нечего делать');
импортером может быть массив функций, которые будут вызываться LibSass в порядке их появления в массиве. Это помогает пользователю указать специальный импортер для определенного типа пути (файловая система, http). Если импортер не хочет обрабатывать определенный путь, он должен вернуть null
. Дополнительную информацию о типах Sass см. в разделе «Функции».
Это экспериментальная функция LibSass. Используйте с осторожностью.
functions
— это Object
, который содержит набор пользовательских функций, которые могут вызываться компилируемыми файлами SASS. Они могут принимать ноль или более входных параметров и должны возвращать значение либо синхронно ( return ...;
), либо асинхронно ( done();
). Эти параметры будут экземплярами одного из конструкторов, содержащихся в хеше require('node-sass').types
. Возвращаемое значение также должно относиться к одному из этих типов. Список доступных типов смотрите ниже:
getValue()
/ setValue(value)
: получает/устанавливает числовую часть числа.
getUnit()
/ setUnit(unit)
: получает/устанавливает единицу числа.
getValue()
/ setValue(value)
: получает/устанавливает включенную строку
getR()
/ setR(value)
: красный компонент (целое число от 0
до 255
)
getG()
/ setG(value)
: зеленый компонент (целое число от 0
до 255
)
getB()
/ setB(value)
: синий компонент (целое число от 0
до 255
)
getA()
/ setA(value)
: альфа-компонент (число от 0
до 1.0
)
Пример:
var Color = require('node-sass').types.Color, c1 = новый цвет (255, 0, 0), c2 = новый цвет (0xff0088cc);
getValue()
: получает вложенное логическое значение
types.Boolean.TRUE
: Одиночный экземпляр types.Boolean
, который содержит значение «истина».
types.Boolean.FALSE
: Одиночный экземпляр types.Boolean
, который содержит значение «false».
getValue(index)
/ setValue(index, value)
: value
само должно быть экземпляром одного из конструкторов в sass.types
.
getSeparator()
/ setSeparator(isComma)
: использовать ли запятые в качестве разделителя
getLength()
getKey(index)
/ setKey(index, value)
getValue(index)
/ setValue(index, value)
getLength()
types.Null.NULL
: Одноэлементный экземпляр types.Null
.
sass.renderSync({ данные: '#{headings(2,5)} {color: #08c; }', функции: {'headings($from: 0, $to: 6)': function(from, to) { var i, f = from.getValue(), t = to.getValue(), list = new sass.types .List(т - ж + 1); for (i = f; i <= t; i++) {list.setValue(i - f, new sass.types.String('h' + i)); } список возврата;} }});
Тип: Array
По умолчанию: []
Массив путей, которые LibSass может просмотреть, чтобы попытаться разрешить ваши объявления @import
. При использовании data
рекомендуется использовать это.
Тип: Boolean
По умолчанию: false
Значения true
включают синтаксис Sass с отступом для анализа строки данных или файла.
Примечание. node-sass/libsass скомпилирует смешанную библиотеку файлов scss и файлов с отступом (.sass) с настройкой по умолчанию (false), если в именах файлов используются расширения .sass и .scss.
Тип: String
По умолчанию: space
Используется для определения того, использовать ли для отступа пробел или символ табуляции.
Тип: Number
По умолчанию: 2
Максимум: 10
Используется для определения количества пробелов или табуляции, которые будут использоваться для отступов.
Тип: String
По умолчанию: lf
Используется, чтобы определить, следует ли использовать последовательность cr
, crlf
, lf
или lfcr
для разрыва строки.
Тип: Boolean
По умолчанию: false
Особенность: при использовании этого параметра вам также следует указать outFile
, чтобы избежать неожиданного поведения.
Значения true
отключают включение информации об исходной карте в выходной файл.
Тип: String | null
По умолчанию: null
Специальное: требуется, если sourceMap
является правдивым значением.
Укажите предполагаемое расположение выходного файла. Настоятельно рекомендуется при выводе исходных карт, чтобы они могли правильно ссылаться на нужные файлы.
Внимание: включение этой опции не запишет файл на диск автоматически, а только для внутренних справочных целей (например, для создания карты).
Пример того, как записать его на диск
sass.render({...outFile: yourPathTotheFile, }, function(error, result) { // обратный вызов в стиле узла, начиная с версии 3.0.0if(!error){ // При компиляции ошибок нет, запишите этот результат на диск fs.writeFile(yourPathTotheFile, result.css, function (err){if(!err){ //файл записан на диске} });} });});
Тип: String
По умолчанию: nested
Значения: nested
, expanded
, compact
, compressed
Определяет выходной формат окончательного стиля CSS.
Тип: Integer
По умолчанию: 5
Используется для определения допустимого количества цифр после запятой. Например, если у вас есть десятичное число 1.23456789
и точность 5
, в окончательном CSS результат будет 1.23457
.
Тип: Boolean
По умолчанию: false
true
Включает номер строки и файл, в котором определен селектор, для отправки в скомпилированный CSS в качестве комментария. Полезно для отладки, особенно при использовании импорта и миксинов.
Тип: Boolean | String | undefined
По умолчанию: undefined
Включает генерацию исходной карты во время render
и renderSync
.
Когда sourceMap === true
, значение outFile
используется в качестве целевого выходного местоположения для исходной карты с добавленным суффиксом .map
. Если outFile
не установлен, параметр sourceMap
игнорируется.
Когда typeof sourceMap === "string"
значение sourceMap
будет использоваться в качестве места записи файла.
Тип: Boolean
По умолчанию: false
true
включает contents
исходной карты.
Тип: Boolean
По умолчанию: false
true
встраивает исходную карту как URI данных.
Тип: String
По умолчанию: undefined
значение будет указано как sourceRoot
в информации об исходной карте.
render
обратный вызов (>= v3.0.0) node-sass поддерживает стандартные асинхронные обратные вызовы в стиле узла с сигнатурой function(err, result)
. В условиях ошибки аргумент error
заполняется объектом ошибки. В случае успеха объект result
заполняется объектом, описывающим результат вызова рендеринга.
message
(String) — Сообщение об ошибке.
line
(Номер) - Номер строки ошибки.
column
(номер) — номер столбца с ошибкой.
status
(номер) — код состояния.
file
(строка) — имя файла ошибки. Если параметр file
не был установлен (в пользу data
), это будет отражать значение stdin
.
css
(буфер) — скомпилированный CSS. Запишите это в файл или раздайте по мере необходимости.
map
(Буфер) — исходная карта
stats
(Объект) — объект, содержащий информацию о компиляции. Он содержит следующие ключи:
entry
(строка) — путь к файлу scss или data
, если источником не был файл.
start
(Number) — Date.now() перед компиляцией
end
(Число) — Date.now() после компиляции
duration
(число) – конец – начало
includedFiles
(массив) — абсолютные пути ко всем связанным файлам scss в произвольном порядке.
var sass = require('node-sass');sass.render({ файл: '/путь/к/myFile.scss', данные: 'тело {фон: синий; а {цвет: черный;}} ', importer: function(url, prev, Done) {// url — это путь при импорте как есть, с которым столкнулась LibSass. // prev — ранее разрешенный путь. // Done — необязательный обратный вызов, либо используйте его, либо возвращайте значение синхронно .// this.options содержит хеш этих параметров, this.callback содержит callbacksomeAsyncFunction(url, prev, function(result){ Done({file: result.path, // only) в стиле узла один из них обязателен, см. раздел Special Behaviours.contents: result.data });});// ORvar result = someSyncFunction(url, prev);return {file: result.path,contents: result.data}; }, includePaths: ['lib/', 'mod/'], outputStyle: 'compressed'}, function(error, result) { // обратный вызов в стиле узла, начиная с версии 3.0.0 если (ошибка) {console.log(error.status); // раньше это был «код» в v2x и нижеconsole.log(error.column);console.log(error.message);console.log(error.line); } else {console.log(result.css.toString());console.log(result.stats);console.log(result.map.toString());// или Betterconsole.log(JSON.stringify(result. карта)); // обратите внимание, JSON.stringify также принимает Buffer }});// ORvar result = sass.renderSync({ файл: '/путь/к/файлу.scss', данные: 'тело {фон: синий; а {цвет: черный;}} ', стиль вывода: 'сжатый', outFile: '/to/my/output.css', sourceMap: true, // или абсолютный или относительный (к outFile) путь importer: function(url, prev, Done) {// url — это путь при импорте как есть, с которым столкнулась LibSass. // prev — ранее разрешенный путь. // Done — необязательный обратный вызов, либо используйте его, либо возвращайте значение синхронно .// this.options содержит эти параметры hashsomeAsyncFunction(url, prev, function(result){ Done({file: result.path, // требуется только один из них, см. раздел Специальные Behaviours.contents: result.data });});// ORvar result = someSyncFunction(url, prev);return {file: result.path,contents: result.data}; }});console.log(result.css);console.log(result.map);console.log(result.stats);
В случае, если установлены параметры file
и data
, node-sass будет отдавать приоритет data
и использовать file
для расчета путей в исходных картах.
Информация о версии node-sass
и libsass
теперь предоставляется с помощью метода info
:
var sass = require('node-sass');console.log(sass.info);/* он выведет что-то вроде: node-sass 2.0.1 (обертка) [JavaScript] libsass 3.1.0 (компилятор Sass) [ С/С++]*/
Поскольку node-sass >=v3.0.0 версия LibSass определяется во время выполнения.
Список случаев использования сообществом node-sass в инструментах и средах сборки.
@jasonsanjose создал расширение Brackets на основе node-sass: https://github.com/jasonsanjose/brackets-sass. При редактировании файлов Sass расширение компилирует изменения при сохранении. Расширение также интегрируется с Live Preview, чтобы отображать изменения Sass в браузере без сохранения или компиляции.
Официальный плагин sass Brunch по умолчанию использует node-sass и автоматически переключается на Ruby, если обнаружено использование Compass: https://github.com/brunch/sass-brunch
Автоматически перекомпилируйте файлы .scss
для HTTP-серверов Connect и Express.
Эта функциональность была перенесена в node-sass-middleware
в node-sass v1.0.0.
@10xLaCroixDrinker написал плагин DocPad, который компилирует файлы .scss
с использованием node-sass: https://github.com/docpad/docpad-plugin-nodesass
@stephenway создал расширение, которое транспилирует Sass в CSS, используя node-sass с duo.js https://github.com/duojs/sass
@sindresorhus создал набор черновых задач на основе node-sass: https://github.com/sindresorhus/grunt-sass
@dlmanning создал плагин gulp sass на основе node-sass: https://github.com/dlmanning/gulp-sass
Веб-сервер Harp @sintaxi неявно компилирует файлы .scss
с использованием node-sass: https://github.com/sintaxi/harp
@stevenschobert создал плагин для работы с металлом на основе node-sass: https://github.com/stevenschobert/metalsmith-sass
@fourseven создал плагин метеора на основе node-sass: https://github.com/fourseven/meteor-scss
@dbashford создал модуль Mimosa для sass, который включает node-sass: https://github.com/dbashford/mimosa-sass
Здесь также есть пример приложения для подключения: https://github.com/andrew/node-sass-example.
Node-sass включает предварительно скомпилированные двоичные файлы для популярных платформ. Чтобы добавить двоичный файл для вашей платформы, выполните следующие действия:
Ознакомьтесь с проектом:
git clone --recursive https://github.com/sass/node-sass.gitcd node-sass установка npm node scripts/build -f # использовать ключ -d для отладочной версии#. В случае успеха он сгенерирует и переместит# двоичный файл в каталог поставщика.
Интерфейс для использования командной строки на данном этапе довольно упрощен, как показано в следующем разделе использования.
Вывод будет отправлен на стандартный вывод, если флаг --output
опущен.
node-sass [options] [output]
Или: cat | node-sass > output
Пример:
node-sass src/style.scss dest/style.css
Параметры:
-w, --watch Просмотр каталога или файла -r, --recursive Рекурсивно просматривать каталоги или файлы -o, --output Выходной каталог -x, --omit-source-map-url Исключить комментарий URL-адреса исходной карты из вывода -i, --indented-syntax Обрабатывать данные из стандартного ввода как код SASS (в отличие от scss) -q, --quiet Подавить вывод журнала, за исключением ошибок -v, --version Выводит информацию о версии --output-style Стиль вывода CSS (вложенный | расширенный | компактный | сжатый) --indent-type Тип отступа для вывода CSS (пробел | табуляция) --indent-width Ширина отступа; количество пробелов или табуляции (максимальное значение: 10) --linefeed Стиль перевода строки (cr | crlf | lf | lfcr) --source-comments Включить отладочную информацию в вывод --source-map Выдать исходную карту --source-map-contents Вставить содержимое на карту --source-map-embed Встроить sourceMappingUrl как URI данных --source-map-root Базовый путь, будет указан в исходной карте как есть --include-path Путь для поиска импортированных файлов --follow Следовать по каталогам, связанным с символическими ссылками --precision Допустимая точность в десятичных числах --error-bell Выводить символ колокольчика при ошибках --importer Путь к файлу .js, содержащему пользовательский импортер --functions Путь к файлу .js, содержащему пользовательские функции --help Распечатать информацию об использовании
input
может быть либо одним .scss
или .sass
, либо каталогом. Если входные данные представляют собой каталог, также необходимо указать флаг --output
.
Кроме того, обратите внимание, что --importer
принимает путь (абсолютный или относительный к pwd) к js-файлу, для которого по умолчанию должен быть установлен module.exports
для функции импортера. См., например, наши испытательные стенды.
Опция --source-map
принимает логическое значение, и в этом случае расширение назначения заменяется на .css.map
. Он также принимает путь к файлу .map
и даже путь к нужному каталогу. При компиляции каталога --source-map
может быть либо логическим значением, либо каталогом.
node-sass поддерживает различные параметры конфигурации для изменения настроек, связанных с двоичным файлом sass, таких как имя двоичного файла, двоичный путь или альтернативный путь загрузки. Следующие параметры поддерживаются node-sass:
Имя переменной | параметр .npmrc | Аргумент процесса | Ценить |
---|---|---|---|
SASS_BINARY_NAME | sass_binary_name | --sass-двоичное-имя | путь |
SASS_BINARY_SITE | sass_binary_site | --sass-binary-сайт | URL-адрес |
SASS_BINARY_PATH | sass_binary_path | --sass-двоичный-путь | путь |
SASS_BINARY_DIR | sass_binary_dir | --sass-binary-dir | путь |
SASS_REJECT_UNAUTHORIZED | sass_reject_unauthorized | --sass-reject-неавторизованный | ценить |
Эти параметры можно использовать в качестве переменной среды:
Например, export SASS_BINARY_SITE=http://example.com/
В виде локального или глобального файла конфигурации .npmrc:
Например, sass_binary_site=http://example.com/
В качестве аргумента процесса:
Например, npm install node-sass --sass-binary-site=http://example.com/
Если вы используете самозаверяющие сертификаты для своего двоичного файла, SASS_REJECT_UNAUTHORIZED
переопределит (rejectUnauthorized)[https://nodejs.org/docs/latest/api/tls.html#tls_tls_createserver_options_secureconnectionlistener].
При установке выполняется только два теста Mocha, чтобы проверить, может ли ваш компьютер использовать предварительно созданный LibSass, что сэкономит некоторое время во время установки. Если какие-либо тесты не пройдут, сборка будет выполнена из исходного кода.
Этот модуль предоставлен и поддерживается следующими людьми:
Майкл Мифсуд — руководитель проекта (Github/Twitter)
Эндрю Несбитт (Github/Twitter)
Дин Мао (Github/Twitter)
Бретт Уилкинс (Github/Twitter)
Кейт Сиркел (Github/Twitter)
Лоран Годер (Github/Twitter)
Ник Шоннинг (Github/Twitter)
Адил Муджахид (Github/Twitter)
Мы <3 наших участников! Особая благодарность всем, кто потратил время на разработку этого проекта, мы очень ценим вашу тяжелую работу. Полный список этих людей вы можете найти здесь.
Ознакомьтесь с нашим руководством по участию
Авторские права (c) 2015 г., Эндрю Несбитт. Подробности см. в разделе ЛИЦЕНЗИЯ.