How to install less and compile less file

How to install less and compile less file
Less (sometimes stylized as LESS) is a dynamic style sheet language that can be compiled into Cascading Style Sheets (CSS).

Here we learn how to install less compiler and how to compile less file .

1.First we install Less on our system using following command line

$ sudo gem install less
 

2.Then we install ‘therubyracer’ that is required for Less compilation

$ sudo gem install therubyracer
 

3.Now Less compiler is ready for compile less file 🙂

We create a .less extension file named main.less

#header {
  h1 {
    font-size: 26px;
    font-weight: bold;
  }
  p { 
    font-size: 12px;
    a { 
      text-decoration: none;
      &:hover { 
        border-width: 1px;
      }
    }
  }
}

4.Now We compile this above less file using following command line

$ lessc www/html/lesstest/stylesheets/main.less > www/html/lesstest/stylesheets/style.css
 

 

Note: ‘www/html/lesstest/stylesheets’ is path of directory where main.less exist and where compiled style.css file created

5.Finally, After compilation you get following compiled style.css file

#header h1 {
  font-size: 26px;
  font-weight: bold;
}
#header p {
  font-size: 12px;
}
#header p a {
  text-decoration: none;
}
#header p a:hover {
  border-width: 1px;
}