2015-10-26 3 views
4

Я работаю с действительно большими проектами, которые используют компас (включая инструменты компаса), инструмент sass framework cli (compass watch, compass compile) для создания файла app.css. Sass проекта использует несколько операторов @import, чтобы включить десятки в партитуры sass.Ускорение компас compass sass with sprockets-sass

Проблема заключается в том, что файл app.css компилируется более 2 минут (длина приложения - около 70000 строк) после каждого небольшого изменения в любом пакете sass, частично импортированного в файл app.scss, скомпилировав все из них одновременно, когда мне нужно только 1 смена строки.

Я провел обширное исследование и нашел статьи, подобные этому http://blog.teamtreehouse.com/tale-front-end-sanity-beware-sass-import, который предлагает использовать сокеты вместо @import, чтобы включить парциальные части sass. Мне нравится решение больше, чем большинство, но большой рефакторинг понадобится даже для проверки того, будет ли он работать, и все глобальные включают в себя как mixins и переменные, которые должны быть включены в каждую часть sass, используемую в проекте, которая также не идеальна.

После нескольких исследований я нашел этот инструмент https://github.com/petebrowne/sprockets-sass, который должен автоматически трансформировать @imports в spockets, требует от операторов компилятора, а также сохраняет способность глобального импорта.

Проблема заключается в том, я не знаю, рубин и ничего рубин связанный еще не использовать, то «камень установить» заявление)))

Может кто-то, кто знает, рубин помочь мне объяснить, шаг за шагом, как сделать компас компилятор работает со звездочками?

PS Пожалуйста, не предлагайте такие решения, как libsass, и это похоже на то, что я протестировал его, исключив все связанные с компасом вещи, а libsass также потратил кучу времени на сбор 40000 строк, которые остались без спрайтов (я подозреваю, что часть проблемы не в скорости компиляции, а во временной системе необходимо создать 400000 строк файла после).

+0

Я попытался использовать https://github.com/petebrowne/sprockets-sass в моем файле gulp, как это, но скорость компиляции одинакова. var gulp = require ("gulp"); var compass = require ('gulp-compass'); path = require ('path'); gulp.task ('компас', функция() { gulp.src ('./ дерзость/* СКС ') .pipe (компас ({ проект: path.join (__ имя_директории,' ./') , требуют: [ "Звездочка", "Звездочка-SASS", "SASS", "компас"], CSS: 'cssOut', дерзости: 'SASS', изображения: 'изображения' })) . труба (глотка.Dest ('cssOut')); }); – asmodianis

+0

Перед этим я установил sprockets-sass, как этот 'gem install sprockets-sass'. Похоже, что инструкции @import по-прежнему имеют тот же характер, что и раньше, или звездочки не помогли сделать компиляцию быстрее. – asmodianis

ответ

1

Единственное, что вы можете сделать, это разделить выходной файл верхнего уровня (app.css) на несколько файлов верхнего уровня вывода и в конце компиляции компаса выполнить их с помощью задачи звездочек!

Это оптимизирует использование sass cache, а заключительная concat-задача эффективна, потому что это простая конкатенация!


Кстати, на данный момент, компас заменяется проектом очковых сделанные Chris Eppstein автора Компас.

Итак, рассмотрите идею целого рефакторинга с использованием (grunt/gulp) с помощью libsass (компилятор sass, встроенный в C/C++) и EyeGlass, который добавляет все компас-подобные функции в sass!

желающий Helps!

+0

Я попытался скомпилировать все частичные файлы в отдельные файлы css, но, к сожалению, это невозможно без большого рефакторинга в проекте, частицы используют mixins из файлов @imported выше в app.scss, поэтому, если я попытаюсь скомпилировать его отдельно, это не сработает – asmodianis

+0

вы должны использовать общий частичный во всех нескольких выходных файлов, например: _application-definition.scss требует _mymixins.scsss и _myvariables.scss outputfile1 требует _application-definition.scss outputfile2 требует _application-definition.scss – Hitmands

+0

Да ты Конечно, конечно, но таким образом мне нужно будет удалить префикс из каждого частичного файла, и, как я сказал, это совместное использование @imports необходимо перенести для не одного, а нескольких огромных проектов, которые являются довольно рефакторинговыми усилиями, которых не стоит. Я сомневаюсь, что я получу разрешение сделать этот рефактор таким образом. Скорее всего, текущие проекты останутся такими, какие есть, и будущие будут сделаны с PostCSS. То, что я ищу, - это менее болезненное решение. Хотя я начинаю сомневаться в том, что есть какие-то) – asmodianis

Смежные вопросы