Angular 5 не генерирует некоторые правила CSS из SCSS

Question

Я пишу приложение на Angular 5 и не могу сгенерировать некоторые правила CSS. Вот небольшой пример, HTML:

<table class="table-rule">
    <tr>
        <td class="cell-rule">demo text</td>
    </tr>
</table>

SCSS:

.table-rule {
    font-weight: bold;
    .cell-rule {
        color: red;
    }
}

И вот в чем проблема: я должен получить жирный красный текст в таблице, но я получаю только красный текст (не жирный). Я обнаружил, что Angular генерирует такой CSS:

.table-rule .cell-rule { color: red }

Не генерирует правило CSS для селектора " .table-rule ". Только для селектора " .table-rule .cell-rule ".

Есть идеи, почему это так и как это можно исправить?

P.S. чистый HTML + CSS отлично работает: http://jsbin.com/maxagin/edit?html,css,output

Answer 1

Обнаружил проблему: в рабочем файле .scss была пустая строка комментариев между двумя правилами:

.rule1 {
    ...
}
/**/ <---- this one!
.rule1 {
    ...
}

Удаление этого комментария (/ ** /) исправило преобразование SCSS в CSS. Странная ошибка в SCSS.