Редагуйте свої CSS-конструкції в браузері за допомогою CSS George
Ви коли-небудь хотіли безпосередньо редагувати у вашому веб-переглядачі без переходу назад до файлів CSS? Одним з рішень є інструменти розробників Chrome, але деякі розробники віддають перевагу більш простому робочому процесу.
Ось де CSS George Приходить. Це безкоштовно інструмент для редагування в браузері працює поверх LESS і він ініціюється a простий файл JavaScript.
Більшість розробників віддає перевагу a редактор на основі браузера оскільки не всі використовують прекомпілятор LESS. Але CSS Джордж працює у середовищі LESS які можна швидко встановити через npm.
Якщо у вас встановлено npm, ви можете запустити цей простий код додайте вихідні файли до вашого поточного проекту:
npm install --save-dev css-george
Або ви можете тягніть George.js файл від GitHub, де він розміщений поряд з усіма іншими вихідними файлами. Весь проект є вільним і з відкритим вихідним кодом, так що ви можете завантажити повну копію від GitHub, якщо ви не хочете використовувати npm.
З .js Файл, доданий до заголовка сайту, можна почати виконання функцій Джорджа від браузера. До відкрийте вікно редактора, натисніть клавішу тильди, доступну з Shift + ', розташовану у верхньому лівому куті більшості клавіатур. A нове вікно має виглядати так:
На цьому екрані можна редагувати змінні LESS використовується для всіх від кольорів до розмірів шрифту або сімей шрифту.
Ось тут і плагін LESS стає необхідністю тому що ви повинні розповісти CSS Джордж які змінні включати. Як тільки вони налаштовані, ви можете просто відкрийте редактор браузера CSS George і піти до міста.
Сподіваюся, очевидно, що цей інструмент не слід бути включеним під час виконання. Якщо ви спеціально не хочете дозволити відвідувачам редагувати колір і стиль сторінки, що взагалі не є гарною ідеєю. Крім локальне тестування, CSS George є рідкісним інструментом, який пропонує утиліту для всіх розробників інтерфейсу.
Ти можеш побачити його живим на демонстраційній сторінці CSS George або завантажити повну копію через npm або від репо GitHub.
