CSS has several preprocessor stylesheet languages that can compile to Cascading style sheets and run on the client-side or server-side. One of these preprocessors is Less. The quickest and fastest way to set up Less on our machine and use it in various projects is to install it with Node.js.
If we don’t have Node.js on our machine, we can install it by simply going to the official documentation sources. We can then download the most suitable for over device.
After downloading, we can go to the terminal or command prompt if we are on windows to check if we download the correct and latest version.
node -v // to check the node versionnpm -v // to check the node packgae manager version
After downloading Node.js over the system, we can proceed to install Less on a local machine using Node.js. Type the following in over terminal.
npm install -g less
The -g in the above installs the lessc command globally.
Note: We can use the @version after the package name for a specific version.
npm install -g less@2.7.1
We can also make it available only in a specific project by simply navigating the project directory, and then we install the package using this node command.
npm i less --save-dev
It will install the latest version and its dependencies in the over-project folder and package.json.
Now, we are ready to use the preprocessor.
Create a styles.less file, write some Less codes, then compile it into over styles.css using the below command
lessc styles.less styles.css
It will create a styles.css file if we do not already have it. We can then link the .css file to over index.html and check the effect.
Free Resources