Trusted answers to developer questions
Trusted Answers to Developer Questions

Related Tags

less
js

How to setup and use Less.js

Akande Olalekan Toheeb

Overview

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.

How to install 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 version
npm -v // to check the node packgae manager version

Installing Less

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.

RELATED TAGS

less
js

CONTRIBUTOR

Akande Olalekan Toheeb
Copyright ©2022 Educative, Inc. All rights reserved
RELATED COURSES

View all Courses

Keep Exploring