Чи є інструмент, який перетворює css в less.css?

У мене досить великий CSS файл, який я хочу перетворити на менший. Коли я писав CSS, я не знав less.css, але тепер я все ще хочу використовувати свій старий CSS.

Чи є інструмент, який може допомогти мені автоматично перетворити його?

Зараз я щось знайшов: http://leafo.net/lessphp/lessify/

Це основне формулювання, наприклад:

#header {
/* ... */
}

#header p {
/* ... */
}

до

#header {
/* ... */
p {
/* ... */
}
}

Насправді вам не потрібен жоден інструмент перетворення, щоб почати працювати з МЕНШЕ. Менше синтаксис назад сумісний із CSS . Це означає, що будь-який CSS-файл також є дійсним меншим файлом.

Просто дістаньте свій CSS та перейменуйте його у МЕНШИЙ файл. Потім використовуйте менші функції, а також зміни. Чим більше ви будете оновлювати файл, тим більше ви зможете використовувати Менше функцій.

Я зробив те саме для SCSS і дуже великий проект з 10 CSS-файлами. Бути майже неможливо (і величезна витрата часу) переписати всі CSS на SCSS. Я просто перейменував його, а потім кожного разу, коли я працював над файлом CSS, я виконував невеликий рефакторинг коду, щоб скористатися комбінаціями міксинів, змінних тощо.

Ви подивилися на Леста? Набагато краще в перетворенні CSS, ніж в Lessify. Зокрема, Lessify не дуже оптимізує ваші заняття. Він скопіював браузер скидає всі створені міксини, створюючи зайві атрибути. Зрозуміло, що це ще на експериментальній стадії. Жодна утиліта не може визначити семантику, тому вони не можуть перетворити значення у вирази, vars або параметричні міксини.

Щонайменше, це найкраща робота з оптимізації та, здається, є більш функціональною. Він навіть обробляє псевдокласи для вас:

http://toki-woki.net/p/least/

Ці інструменти ідеально підходять для роботи з великими попередніми CSS-файлами. Ось такі кроки, які я рекомендую перетворити CSS у МЕНШЕ (Не забудьте зберегти копію оригінальних файлів CSS):

1. Якщо ви працюєте з декількома файлами CSS-добавок, об'єднайте їх в один CSS-файл. Це гарантує, що все МЕЖЕ і разом оптимізовано.

2. Запустіть отриманий код CSS через онлайн-утиліту очищення CSS. Я мав хороші результати з cleancss: http://www.cleancss.com/ . Це призведе до видалення будь-якої сторонньої та надлишкової розмітки, яка може бути не підхоплена МЕНШИМ перетворювачем.

3. Видаліть @Media і будь-який перезавантажений стиль у файлі CSS. Вони можуть створити проблеми або ввести можливі надмірності. Мабуть, хороша ідея зберігати скидання в окремому файлі.

4. Вставте отриманий файл CSS в Least і спостерігайте за звіром.

5. Повторно введіть скидання та @screen.

6. Тепер, коли ви закінчите, перегляньте кожен з атрибутів і знайдіть хороших кандидатів для рефакторингу та перетворіть їх на менші змінні та вирази. Кольорові та шрифтові атрибути CSS - це найпростіший фактор, який просте, простий глобальний пошук та заміна працює добре. Наприкінці ви можете вирішити, чи хочете ви розділити один файл на менші логічні файли. Ви можете виявити, що процес змушує вас реорганізувати файли іншим способом.

Я не автор Леаста, просто хтось шукав подібний інструмент і вирішив розповісти про це світові.

Я не думаю, що існує спосіб, щоб конвертер дізнався, що ви хочете зробити з великою частиною коду.

Наприклад, не обов'язково знати, які змінні ви хочете використовувати. Або як генерувати міксини чи функції.

Я думаю, що з цим вам потрібно буде це зробити вручну.

Як щодо пошуку та заміни.

якщо у вас є, color:#ffffffі ви хочете змінити його@color

просто шукайте color:#ffffffабо color : #ffffffзамінюйте @color.

Я зазвичай не довіряю цим інструментам.

або ви можете написати справді простий скрипт PHP, який обробляє його.

Оновлення 1 :
Або ви можете скористатись http://nex-3.com/posts/96-scss-sass-is-a-css-extension, який схожий на менший та має інструмент для перетворення.

Спробуйте цей сайт: css2less.cc

Він перетворює ваш CSS у менше, коли ви вводите текст.