как посмотреть файл sass

Я только что решил начать изучать sass, но все еще пытаюсь запустить sass на своем компьютере. Я уже скачал и установил его, как показано на рисунках:

введите здесь описание изображения

введите здесь описание изображения

Папка, в которой у меня есть проект, находится внутри папки htdocs в папке xampp. Я набрал C:\Users\Thulani>sass --watch C:\xampp\htdocs\ruby\lib\sass\style.scss:style.css в командной строке, но это только говорит, что sass отслеживает изменения.

введите здесь описание изображения

Как я могу внести изменения в свой файл style.scss и увидеть эти изменения?

Вот мой html:

<html>
<head>
   <title> Import example of sass</title>
   <link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
   <h1>Simple Example</h1>
   <h3>Welcome to TutorialsPoint</h3>
</body>
</html>

Пожалуйста помоги


person user agent    schedule 11.10.2016    source источник
comment
Вы пытались внести изменения в свой style.scss? Если вы выполняете задачу --watch, любые изменения, внесенные во входные данные, будут скомпилированы и выведены в место назначения по вашему выбору. sass-lang.com/documentation/file.SASS_REFERENCE.html#using_sass   -  person imjared    schedule 11.10.2016
comment
Да. Я пытаюсь что-то изменить в style.scss, но ничего не происходит.   -  person user agent    schedule 11.10.2016


Ответы (2)


Используйте эту команду в папке, которую вы хотите посмотреть.

sass -w src/assets

если вы не хотите, чтобы файлы карты использовали это

sass -w src/assets --sourcemap=none
person Mertcan Diken    schedule 10.02.2017

Из того, что вы дали, я могу только сказать, что, возможно, вы допустили ошибку, фактически не вызывая какой-либо класс или идентификатор из своего файла CSS. Было бы неплохо, если бы вы могли загрузить и это, но я предполагаю, что вы пытались стилизовать только элементы <h1> и <h3>. Поскольку вы новичок, я напишу вам очень простой тестовый код, который должен работать.

Вот мой HTML-файл:

  <!DOCTYPE html>
  <html lang="en-GB">
  <head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="initial-scale=1">

    <title>Test</title>

    <link type="text/css" rel="stylesheet" href="style.css"/>
 </head>
 <body>
    <div id="red">
       <h1>I am red !</h1>
     </div>
     <div id="blue">
       <h2>I am blue</h2>
     </div>
   </body>

Мой файл SCSS:

    //@import "Filename";
// use import if you want to link two or more style sheets together (makes one big css file)

/* Colours used */
$red: red;
$blue: blue;

html, body{
    width: 100%;
    overflow-x:hidden;
    margin: 0;
    padding: 0;
}
body {
    background-color: white;
    font-family: sans-serif;
}
#red {
    color: $red;
}
#blue {
    color: $blue;
}

Прохождение теста преобразования SCSS в CSS

person Mobeen    schedule 10.02.2017