Czy powinienem używać plików @ import lub manifest?

Rails 3.1 wprowadza nowy sposób organizacji zarówno JS jak i CSS wraz z wprowadzeniem plików manifestu. Na przykład, application.js może wyglądać tak: 

//= require jquery
//= require jquery-ui
//= require jquery_ujs
//= require_tree .

To pobierze różne bity Jquery, wszystkie twoje własne JS, połączy je ze sobą i będzie służyć jako pojedynczy plik dla klientów. Dość proste.

Niestety zdjęcie nie jest dla mnie tak jasne z SASS. SASS ma już wbudowaną konkatenację za pomocą @import.

Czy powinienem zmienić wszystkie moje częściowe na pełne SASS pliki, a następnie połączyć je za pomocą pliku manifest lub kontynuować za pomocą @ import? Dlaczego?

Author: Rupert Madden-Abbott, 2011-05-20
Source

3 answers

Sprockets konwertuje wszystkie import do CSS przed połączeniem, więc nie może być używany do współdzielenia mixinów i zmiennych między plikami. Zgaduję, że tak pozostanie tylko dlatego, że możesz importować pliki SASS, LESS i CSS za pomocą tej metody.

Więc tak to robię:

  • Jeśli mam ERB do załączenia (głównie dla połączeń asset_path()), umieszczam je w moim głównym pliku, aplikacji.css.scss.erb
  • Jeśli posiadam CSS, który chcę włączyć, wymagam go poprzez Sprockets, np. //=require jquerymobile
  • w tym samym pliku, używam polecenia Sass @ import, aby jawnie załadować wszystkie pliki. Żaden z plików @ import ' ED nie może być .ale erb.
    1. załaduj podstawowe rzeczy (np. reset) i importuj za pomocą mixinów
    2. zadeklaruj zmienne
    3. import specyficznych stylów

Oto jak moja aplikacja.css wygląda w tej chwili. Nie zapomnij o"; " i cytatach: 

// Using SASS import is required for variables and mixins to carry over between files.
@import "reset.css.scss";
@import "mixins.css.scss";

$color_base: #9b2d31;
$color_background: #c64e21;

// Using asset_path is important for browsers to use versioned url for the asset.
// This lets us do aggressive caching.
$logo-url: url(<%= asset_path("logo.png") %>);

@import "application/layout.css.scss";
@import "application/sidebar.css.scss";
@import "application/videos.css.scss";
@import "application/pages.css.scss";
...

Zauważ, że wciąż badam rurociąg zasobów Rails 3.1, więc twój przebieg może się różnić. Postaram się wrócić i zaktualizować, jeśli znajdę coś innego interesującego.

 30
Author: webmat,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-06-09 15:34:46

Najlepszym sposobem rozwiązania tego problemu jest użycie natywnej dyrektywy @import, jak wyjaśniono tutaj: https://github.com/rails/sass-rails#important-note

Na to pytanie odpowiedziano już tutaj: Jak używać sprockets import with sass

Mam nadzieję, że to pomoże! :)
 2
Author: user2263402,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2017-05-23 11:46:54

Sass-rails gem jawnie stwierdza nie używa składni require z plikami SASS - użyj SASS @import zamiast oświadczeń.

 1
Author: Yarin,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-11-23 19:16:05