Получение ошибки Файл для импорта не найден или не читается: compass / css3 - PullRequest
Новая
       59

Получение ошибки Файл для импорта не найден или не читается: compass / css3

0 голосов
/ 10 февраля 2019

Я просматривал буквально каждый вопрос в сети с этим сообщением об ошибке, но ни одно из решений не работало и не было связано с моей проблемой.Это все шаги, которые я предпринял:

На терминале я захожу в папку Sites и набираю следующий код: 

compass create project1

Затем я cd в sass Папка и введите это: 

sass --watch styles.scss:styles.css

Затем я получаю это сообщение об ошибке: 

error styles.scss (Line 1: File to import not found or unreadable: compass/css3.)

Итак, я cd в мою папку project1 и набираю compass watch, увидев, если этоделает что-нибудь и говорит: 

Compass is watching for changes. Press Ctrl-C to Stop.

Так что никаких ошибок нет.Я даже проверяю, установлен ли Compass, набрав compass -v и получил следующее: 

Compass 1.0.3 (Polaris)
Copyright (c) 2008-2019 Chris Eppstein
Released under the MIT License.
Compass is charityware.
Please make a tax deductable donation for a worthy cause: http://umdf.org/compass

.., что означает, что Compass уже установлен.Я также забыл упомянуть, что в первый раз, когда я сделал compass compile на терминале, я получил это сообщение об ошибке (я скопировал все):

CS-MacBook-Pro: компиляция newproject cs $ compass

ПРЕДУПРЕЖДЕНИЕ О УСТРАНЕНИИ в строке 87 файла /Users/cs/.rvm/gems/ruby-2.6.0/gems/compass-core-1.0.3/stylesheets/compass/css3/_deprecated-support.scss:

# {} интерполяция вблизи операторов будет упрощена в будущей версии Sass.Чтобы сохранить текущее поведение, используйте кавычки:

unquote ('' $ moz - "# {$ экспериментально-поддержка-для-mozilla}" $ webkit - "# {$ экспериментально-поддержка-для-webkit}"$ opera -" # {$ экспериментальная поддержка для оперы} "$ microsoft -" # {$ экспериментальная поддержка для микрософт} "$ khtml -" # {$ экспериментальная поддержка для khtml} ')

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

ПРЕДУПРЕЖДЕНИЕ ОБ УДАЛЕНИИ в строке 92 файла /Users/cs/.rvm/gems/ruby-2.6.0/gems/compass-core-1.0.3 / stylesheets / compass / css3 / _deprecated-support.scss:

# {} интерполяция вблизи операторов будет упрощена в будущей версии Sass.Чтобы сохранить текущее поведение, используйте кавычки:

unquote ('"$ ie6 -" # {$ legacy-support-for-ie6} "$ ie7 -" # {$ legacy-support-for-ie7}"$ ie8 -" # {$ legacy-support-for-ie8} ')

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

write stylesheets / styles.css

CS-MacBook-Pro: новый проект cs $

Итак, я следую решению пользователя mrpatricko на github здесь: https://github.com/Compass/compass/issues/2052, который исправлен просто сообщение «ПРЕДУПРЕЖДЕНИЕ ОБ УСТРАНЕНИИ».Но это все еще не исправляет основную ошибку, которую я получаю.Я все еще вижу ошибку "импорт файла".Я не знаю, что еще делать отсюда.Я чувствую, что попробовал все.Может кто-нибудь, пожалуйста, помогите?Полный код включен здесь: 

@import "compass/css3";

@import "compass";
@import url("https://fonts.googleapis.com/css?family=Lato");

$background: #e74c3c;
$select-color: #fff;
$select-background: #c0392b;
$select-width: 220px;
$select-height: 40px; 

body { 
  font-family: Lato, Arial;
  color: $select-color;
  padding: 20px;
  background-color: $background;
}
h1 {
  font-weight: normal;
  font-size: 40px;
  font-weight: normal;
  text-transform: uppercase;
  span { 
    font-size: 13px;
    display: block;
    padding-left: 4px;
  }
}
p {
  margin-top: 200px;
  a {
    text-transform: uppercase;
    text-decoration: none;
    display: inline-block;
    color: #fff;
    padding: 5px 10px;
    margin: 0 5px;
    background-color: darken($select-background, 2);
    @include transition(all 0.2s ease-in);
    &:hover {
      background-color: darken($select-background, 5);
    }
  }
}
.select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 10px;
}
.select {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 16px;
  color: $select-color;
  width: $select-width;
  height: $select-height;
}
.select-styled {
  position: absolute; 
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: $select-background;
  padding: 8px 15px;
  @include transition(all 0.2s ease-in);
  &:after {
    content:"";
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-color: $select-color transparent transparent transparent;
    position: absolute;
    top: 16px;
    right: 10px;
  }
  &:hover {
    background-color: darken($select-background, 2);
  }
  &:active, &.active {
    background-color: darken($select-background, 5);
    &:after {
      top: 9px;
      border-color: transparent transparent $select-color transparent;
    }
  }
}

.select-options {
  display: none; 
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: darken($select-background, 5);
  li {
    margin: 0;
    padding: 12px 0;
    text-indent: 15px;
    border-top: 1px solid darken($select-background, 10);
    @include transition(all 0.15s ease-in);
    &:hover {
      color: $select-background;
      background: $select-color;
    }
    &[rel="hide"] {
      display: none;
    }
  }
}
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" />
    <link href="/stylesheets/print.css" media="print" rel="stylesheet" type="text/css" />
    <!--[if IE]>
      <link href="/stylesheets/ie.css" media="screen, projection" rel="stylesheet" type="text/css" />
    <![endif]-->
    <link href="/stylesheets/styles.css" media="print" rel="stylesheet" type="text/css" />
</head>
<body>

<h1>Custom Select <span>Without Plugin</span></h1>
<!--
TO DO:
1. Add icons to List 
2. Toogle opened state
-->

<select id="mounth">
    <option value="hide">-- Month --</option>
    <option value="january" rel="icon-temperature">January</option>
    <option value="february">February</option>
    <option value="march">March</option>
    <option value="april">April</option>
    <option value="may">May</option>
    <option value="june">June</option>
    <option value="july">July</option>
    <option value="august">August</option>
    <option value="september">September</option>
    <option value="october">October</option>
    <option value="november">November</option>
    <option value="december">December</option>
</select> 

<select id="year">
    <option value="hide">-- Year --</option>
    <option value="2010">2010</option>
    <option value="2011">2011</option>
    <option value="2012">2012</option>
    <option value="2013">2013</option>
    <option value="2014">2014</option>
    <option value="2015">2015</option>
</select>

<p>See the <a href="https://codepen.io/wallaceerick/pen/fEdrz">Custom File Upload</a> demo!</p> 

</body>
</html>
...