Создание новых основанных на фреймворке проектов и использование LESS - PullRequest
Новая
       15

Создание новых основанных на фреймворке проектов и использование LESS

4 голосов
/ 12 декабря 2011

Поэтому я пытаюсь создать среду, в которой я могу создать новый проект и минимизировать настройки / сложности, связанные с настройкой этого нового проекта.Я использую Structurer Pro (из nettuts +) для создания набора файлов, и это потрясающая вещь.У меня настроен github для MAC, что позволяет мне получать последние файлы платформы Foundation и вставлять их в текущий проект.

Теперь я пытаюсь также включить LESS в этот процесс.Однако CSS-файлы Foundation в настоящее время не настроены с LESS, что означает, что у меня есть 2 варианта ... (1) взять текущую версию и LESS-ize их, а затем использовать эти пользовательские файлы для создания новых проектов.(2) не используйте LESS ...

Другая проблема, с которой я столкнулся, заключается в том, что, похоже, довольно мало компиляторов для LESS (simpLESS, CodeKit, LESS, compass), но ни один из них не объединяет cssфайлы!Поэтому, если я настрою 10 файлов LESS (например, IE.less, mobile.less, grid.less, typography.less и т. Д.) И в них будут переменные, я действительно не хочу, чтобы 10 файлов css выводились.Я действительно хочу 1 скомпилированный файл CSS в качестве вывода.Я знаю, что могу сделать это вручную, или даже через Clean CSS или любой из 30 других сайтов ...

Но есть ли одна вещь, которая позволит мне использовать последние файлы для созданиякаркас проекта, настроить его, применив набор образцов цвета к ряду переменных (LESS), затем скомпилировать и объединить полученный CSS для фактической реализации?

Ответы [ 3 ]

2 голосов
/ 30 октября 2012

Фонд в конечном итоге перешел на SCSS в версии 3, так что это стало своего рода спорным вопросом ...

1 голос
/ 17 января 2012

Попытка ответить на некоторые из ваших вопросов:

  1. Переименуйте файлы .css Фонда в .less и поместите в каталог / less /.
    • Любой файл .css является допустимым .less файлом (но не наоборот)
    • Вам не нужно конвертировать этот CSS в LESS, делайте это только для вещей, которые вы собираетесьвнесите изменения и сэкономьте время;)
  2. В ваш файл master.less импортируйте эти файлы с помощью @import 'foundation-file';
    • re: как объединять файлы css / less:)
  3. Скомпилируйте только master.less и включите его в свой HTML
    • master.lessВаша предполагаемая MAIN таблица стилей, которая может фактически содержать только операторы @import, для меня проще управлять всем таким образом (и там, где происходит комбинация).он скомпилируется в master.css, который вы затем используете.
0 голосов
/ 15 декабря 2011

Я не уверен, что включает в себя css foundation, если это reset.css или что-то подобное, я бы просто оставил его, а не меньше. У вас будет два css-файла: один reset.css и один styles.css (последний из которых будет скомпилирован из меньшего количества файлов).

Затем вы можете добавить свои собственные настройки, в том числе style.less, который @ импортирует различные компоненты, если вы сделаете это достаточно универсальным, вы сможете использовать его в различных проектах.

Компилятор lessc обрабатывает @imports различных файлов и объединяет их в один файл: у меня есть styles.less, который @imports base.less components.less и т. Д. Я просто компилирую styles.less в styles.css и это обрабатывает остальное: 

lessc styles.less styles.css

См .: https://gist.github.com/1480684

...