Динамическая загрузка правил Less.js

Включение Less.js в веб-сайт может улучшить его возможности стилизации. Однако есть одно ограничение: необходимо загружать все таблицы стилей LESS перед сценарием Less.js. Это может стать проблемой, когда определенные стили необходимо загружать динамически после начальной загрузки страницы.

Текущие ограничения

В настоящее время Less.js определяет порядок загрузки внешних таблицы стилей и сценарий играют решающую роль. При обратном порядке, как показано ниже, файл style.less не загружается ни в Firefox, ни в Chrome:

Решение в Less.js v1.0.31

Чтобы устранить это ограничение, в версии 1.0.31 Less.js появился метод less.refreshStyles(). Этот метод позволяет перекомпилировать теги

Реализация динамической загрузки

Чтобы реализовать динамическую загрузку Less. js, выполните следующие действия:

1. Убедитесь, что вы используете Less.js версии 1.0.31 или более поздней.
2. Включите тег
3. Добавьте правила LESS, которые вы хотите применять динамически, в теге
4. Вызовите less.refreshStyles(), чтобы перекомпилировать и применить новые правила.

Пример:

В JavaScript:

less.refreshStyles();