Преобразование строки Sass (не SCSS) в строку CSS


Мне нужно скомпилировать строки SASS и SCSS в строки CSS для проекта. Поэтому я использую пакет узлов node-sass. Преобразование SCSS работает нормально, а SASS — нет.

Пример кода для SASS:

'use strict';

var sass = require('node-sass');

var dataTemp = 'body{background:blue; a{color:black;}}';

var output = sass.renderSync({
  data: dataTemp
});

console.log(output.css.toString());

Проблема возникает, когда я пытаюсь преобразовать что-то подобное, что должно быть допустимым синтаксисом .sass

'use strict';

var sass = require('node-sass');

var dataTemp = '.red\n color: red';

var output = sass.renderSync({
  data: dataTemp
});

console.log(output.css.toString());

Вывод консоли:

Error: Invalid CSS after ".": expected 1 selector or at-rule, was ".red color: red "

Таким образом, очевидно, что node-sass не может компилировать код .sass таким образом. Синтаксис node-sass:

var result = sass.renderSync({
  data: scss_content
  [, options..]
});

Внутри объекта вы можете определить параметры и даже функции. Может быть, есть способ скомпилировать данные в такой функции?

Любые другие решения или рекомендации для других пакетов?


node.js css sass node-sass
person Clemens Basler    schedule 27.04.2016    source источник
comment
Вы не сказали нам, почему это не работает? У вас также есть опечатка в outpu.css   -  person duncanhall    schedule 27.04.2016
comment
Спасибо за ответ! :)   -  person Clemens Basler    schedule 27.04.2016

Ответы (2)


arrow_upward
4
arrow_downward

Что ж, добавив параметр с именем «indentedSyntax» и установив для него значение «true», node-sass также может компилировать код .sass. Извините, надо было более внимательно прочитать документацию. Спасибо за помощь!

'use strict';

var sass = require('node-sass');

var dataTemp = '.red\n color: red';

var output = sass.renderSync({
  data: dataTemp,
  indentedSyntax: true,
  outputStyle : 'compressed'
});

console.log(output.css.toString());

Журнал: ".red{color:red}"

person Clemens Basler    schedule 04.05.2016

arrow_upward
2
arrow_downward

Ваш SCSS недействителен. Вам необходимо предоставить {} рядом с вашими свойствами:

'use strict';

var sass = require('node-sass');

var dataTemp = '.red {color: red}';

var output = sass.renderSync({
  data: dataTemp
});

console.log(output.css.toString());

Вы можете проверить свой SASS/SCSS с помощью онлайн-инструмента, такого как SassMeister.

person duncanhall    schedule 27.04.2016
comment
Правильно, обычный синтаксис SCSS работает нормально, но синтаксис SASS, который мне тоже нужен, не работает. Там была опечатка, но «.red\n color: red» должен быть допустимым синтаксисом .sass. - person Clemens Basler; 27.04.2016
comment
Я не уверен, что это правильно. См. обновление к моему сообщению выше — с помощью валидатора ваше исходное значение недействительно, но значение, которое я предложил, действительно. - person duncanhall; 27.04.2016
comment
К сожалению, я не так хорошо знаком с SASS/SCSS, но думаю, что мне нужен синтаксис, описанный в ссылка , где вы можете переключаться между синтаксисом SCSS и SASS. Поэтому я подумал, что .red\n color: red должно быть действительно? - person Clemens Basler; 02.05.2016