Less

Less (which stands for Leaner Style Sheets) is an extension of CSS that enables you to use things like variables, nested rules, inline imports and more.

Configuring Less

You can configure Less from Project Settings -> CSS Tools -> Less.

Change Output Destination

Click the output path on the file options sidebar to manually change the output path of a file. You can also use project wide output options to adjust output path for all Less files.

Source Maps

Enable the SourceMap option to create a sourcemap (.map) file along with the output CSS file. SourceMap files allow you to find the original position of rule sets and properties in the Less file while inspecting pages with developer tools.

Line Numbers

Enable the Line Numbers option to output comments in the CSS file containing the file name and line number of a rule set in the input Less file.

Strict Units

Enable the Strict Units option to prevent Less from performing invalid math operations. For instance

.class {
  width: 1px * 2px;
}

In this case, things are clearly not right - a length multiplied by a length gives an area, but CSS does not support specifying areas. So Less assumes that you meant px and outputs 2px. When strict units are enabled, Less assumes this is a bug in the calculation and throws an error.

Javascript

Enable JavaScript option allows you use execute JavaScript embedded inside of your Less files.

Strict Imports

Strict Imports option prevents you from @import-ing files from inside of a CSS rule set.

Allow Insecure Imports

Allow Insecure Import option allows you to @import files from HTTP hosts without a valid TLS certificate.

Math

Check math documentation for available math operations in Less.

Prefix CSS

Enable the Prefix CSS option to add vendor prefixes to the output CSS file with Autoprefixer.

Minify CSS

Enable the Minify CSS option to minify the output CSS file. Enable this option to minify the output CSS file.

Imported Files

Prepros compiles the parent file whenever you edit an imported file. Prepros also re-scans imported files whenever you edit a file. Refresh project with CTRL+R or CMD+R to manually re-scan imported files.

For instance if you have a file called a.less with the following imports.

@import 'b.less';
@import 'c.less';
@import 'd.less';

Prepros will process a.less whenever you edit b.less, c.less or d.less.

Learn more about Less from Less website.