2

Только начинаю изучать sass и gulp. Для верстки использую готовый шаблон. Целью было вывести изображение в фоне header. Для этого в index.html я прописал:

<body class="ishome">

    <div id="my-page">
      <div id="my-header">
          <header class="site-header" style="background-image: url(img/bg-top.jpg)">

          </header>
      </div>

      <div id="my-content">

      </div>

      <div id="my-footer">

      </div>
   </div>

А в файле main.sass:

body
    font-size: 16px
    min-width: 320px
    position: relative
    line-height: 1.75
    font-family: $default-font
    overflow-x: hidden
    opacity: 1
    &.ishome
        .site-header
            min-height: 700px

При запуске gulp, в командной строке появляется ошибка:

gulp-notify: [Error running Gulp] app\sass\main.sass
Error: Illegal nesting: Only properties may be nested beneath properties.
        on line 39 of app/sass/main.sass
>>     &.ishome {
   ----^

Т.к. я только начинаю разбираться, я не смог самостоятельно понять в чем проблема.

2 ответа 2

2

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

0

была такая же ошибка в SASS - оказалось, что проблема именно в табуляции.

Я редактировал файл с готовыми стилями, в котором отступы делались при помощи Tab (2 пробела). У меня Tab четыре пробельных отступа делал, поэтому я пытался двойным нажатием пробела отступы выставлять, и вылетала ошибка.

В настройках назначил Tab 2 пробельных отступа и ошибка исчезла

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.