Debugging styles in Magento

As described in Chapter 4 , Magento UI Library, Magento 2 offers two ways to compile LESS technology:

• Server-side compilation

• Client-side compilation

Both techniques work in different ways when it comes to workflow development issues, especially when debugging code in an agile and interactive way. Let's explore the two methods of compiling styles and understand how they behave with theme-debugging solutions.

Client-side debugging mode

Client-side debugging on Magento 2 uses the less.js native library. This library uses the rules of in-browser LESS compilation, meant for development environments where the library JavaScript file is too big and its behavior of prioritizing the processing before rendering can generate a feeling of slowness for the user accessing the page. Basically, the less.js library is declared as follows:

<script src="less.js"></script> 

Tip

Refer to the documentation for how to use LESS on the client side:  http://lesscss.org/usage...