Rails / Compass / Sass Compile Super Slow (супер медленная компиляция)

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

Я только начинаю работать с Ruby on Rails и пытаюсь использовать Compass / Sass / Suzy в своем проекте. Все они работают (в основном), но у меня проблемы с компилятором компаса.

Во-первых, использование bundle exec compass watch--poll и без него) ничего не делает. (предполагается, что я понимаю суть этой команды, которая заключается в том, что она повторно компилируется на лету, и мне не нужно обновлять страницу, чтобы увидеть мои изменения, но я могу ошибаться)

Во-вторых, когда я обновляю страницу после изменения моего файла .scss, для завершения компиляции и перезагрузки страницы требуется 30-35 секунд. Это невыносимо. Я читал, что есть некоторые проблемы с последними «рельсами компаса», но большинству сообщений, в которых говорилось, что это было несколько лет назад. Последние версии compass-rails работают безупречно или есть общая проблема, которая вызывает это?

Поскольку я только учусь, у меня есть только один файл controller / view / scss, поэтому я уверен, что у меня нет проблем с циклами зависимостей.

Вот как у меня сейчас настроен проект. (Я думаю, что он настроен правильно, но, возможно, кто-то укажет на то, что я сделал неправильно.)

  1. Я создал новый проект рельсов и сгенерировал «приветственный» контроллер
  2. Модифицировал мой application.rb

application.rb

require_relative 'boot'

require 'rails/all'
require 'susy'
require 'compass'
require 'breakpoint'
require 'normalize-scss'
# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(*Rails.groups)

module PersonalWeb
  class Application < Rails::Application
    # Settings in config/environments/* take precedence over those specified here.
    # Application configuration should go into files in config/initializers
    # -- all .rb files in that directory are automatically loaded.
  end
end
  1. Изменил мой Gemfile

Gemfile

source 'https://rubygems.org'


# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '~> 5.0.0', '>= 5.0.0.1'
# Use mysql as the database for Active Record
gem 'mysql2', '>= 0.3.18', '< 0.5'
# Use Puma as the app server
gem 'puma', '~> 3.0'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 5.0'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .coffee assets and views
gem 'coffee-rails', '~> 4.2'
# See https://github.com/rails/execjs#readme for more supported runtimes
# gem 'therubyracer', platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes navigating your web application faster. Read more: https://github.com/turbolinks/turbolinks
gem 'turbolinks', '~> 5'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.5'
# Use Redis adapter to run Action Cable in production
# gem 'redis', '~> 3.0'
# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'
gem 'susy'
gem 'compass-rails'
gem 'breakpoint'
gem 'normalize-scss'
# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

group :development, :test do
  # Call 'byebug' anywhere in the code to stop execution and get a debugger console
  gem 'byebug', platform: :mri
end

group :development do
  # Access an IRB console on exception pages or by using <%= console %> anywhere in the code.
  gem 'web-console'
end

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin, :x64_mingw, :jruby]
  1. Запустите команду bundle
  2. Application.css переименован в application.css.scss.

application.css.scss

@import "compass";
@import "breakpoint";
@import "welcome.scss";
  1. Добавил немного HTML и sass в мои welcome.erb и welcome.scss соответственно.

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

ИЗМЕНИТЬ

Я решил, что добавлю свой welcome.scss на случай, если я натворил что-нибудь глупое.

welcome.scss

@import "normalize";
@import "partials/variables";
@import "partials/layout";
@import "partials/mixins";
@import "grids";

header {
  height: 100px;
  background: $blue;
  color: $white;
  margin-bottom: 10px;
  padding: 10px;
}

.wrapper {
  background: $white;
  margin: 0 auto;
  max-width: 900px;
}

nav {
  text-align: center;

  ul, li {
    padding: 0;
  }

  li {
    background: $gray;
  }

  a {
    text-decoration: none;
    color: $white;

    &:hover {
      color: $yellow;
    }
  }
}

.first-row {
  height: 100px;
  margin-bottom: 10px;
  padding: 10px;
}

.first-row .first {
  background: $yellow;
  height: 100%;
}

.first-row .second {
  height: 100%;
}

.first-row .second div {
  background: $orange;
  height: 100%;
}

.pic-gallery {
  div {
    background: $violet;
    height: 100%;
    margin-bottom: 10px;
    padding: 10px;
  }
}

.content-bar {
  div {
    background: $green;
    height: 100%;
    margin-bottom: 10px;
    padding: 10px;
  }
}

footer {
  height: 100px;
  background: $blue;
  color: $white;
  margin-top: 10px;
  padding: 10px;
  clear: both;
}

header {
  @include full;

  .logo {
    @include span(wide 1.75);
    @include border-radius(0px);
  }

  h1 {
    @include span(last 2);
    @include breakpoint((max-width 50em)){
      @include span(last 2);
    }
  }
}

.wrapper {
  @include container;
}

Изменить 2. Я должен упомянуть, что использую Windows 10.


person Nick    schedule 11.12.2016    source источник


Ответы (2)


Команда compass watch используется, когда вы используете компас в проекте с голыми костями или в каком-либо фреймворке без конвейера ресурсов. Он следит за изменениями файловой системы и компилирует ваши файлы SASS в CSS. Его можно использовать с livereloadx, но это не основная цель.

Вы не хотите использовать compass watch с Rails. Вместо этого в Rails есть встроенный конвейер ресурсов, который выполняет свою работу лучше.

Если вы по-прежнему хотите использовать другие функции компаса, вам следует использовать гем compass-rails.

1. Добавьте драгоценные камни в гем-файл.

gem 'sass-rails'
gem 'compass-rails'

Затем запустите bundle, чтобы установить драгоценные камни.

2. Настройте свой application.scss

Если у вас есть application.css файл, переименуйте его в application.scss. Обратите внимание, что это не должно называться .css.scss. Удалите все директивы звездочек, которые являются комментариями, которые выглядят следующим образом:

#= require 'foo'

Вместо этого используйте директивы SASS @import:

@import "compass"

Затем следуйте инструкциям в файле readme, чтобы настроить такие расширения, как susy .

person max    schedule 12.12.2016
comment
Вам не нужно требовать драгоценные камни в application.rb, это то, что делает строка Bundler.require(*Rails.groups). - person max; 12.12.2016
comment
Также при импорте файлов в SASS не включайте расширение. Это должно быть @import "welcome";, а не welcome.scss. - person max; 12.12.2016
comment
Не называет его .css.scss соглашением или это вызывает проблемы? - person Nick; 12.12.2016
comment
Sass rails давно прекратил поддержку импорта .css.scss файлов. Это также излишне и глупо, поскольку расширение .scss сообщает нам, что это что-то, что в любом случае компилируется в CSS. - person max; 12.12.2016
comment
Хорошо, @max, я пробовал это дважды. Я сделал новый проект, добавил в гем-файл compass-rails, запустил bundle. Добавлен самоцвет susy. Снова пробежал сверток. Бежал bundle exec compass install susy. Я попытался добавить config.compass.require "susy", но там написано "неизвестная переменная" config, поэтому я удалил его. Добавил контроллер и запустил его, но изменения scss по-прежнему собираются через 20-30 секунд. - person Nick; 12.12.2016
comment
У вас есть часы с компасом, работающие в другом окне? Также извините, но разработка рельсов на Windows обычно отстой, поскольку почти все в любом случае оптимизировано для серверов unix - person max; 12.12.2016
comment
Я бы использовал виртуальную машину или докер для запуска linux или bsd и использовал его для запуска rails. - person max; 12.12.2016
comment
У меня нет бегающих часов. Да, может, я попробую. - person Nick; 12.12.2016

Попробуйте не импортировать весь компас.

Вместо этого импортируйте только нужный модуль, а именно:

@import "compass/typography/links/link-colors"
person lulalala    schedule 12.12.2016
comment
Это определенно сильно ускоряет - person Nick; 12.12.2016