31

Which files are needed to include in <head> section for less css. At less official site , i have just seen that they have told to include .less and .js file. But it is not working without .css file.

RbG
  • 3,181
  • 3
  • 32
  • 43
Moue Mita
  • 321
  • 1
  • 3
  • 6

3 Answers3

52

Referring to LESS documentation (http://lesscss.org/#client-side-usage):

Link your .less stylesheets with the rel set to “stylesheet/less”:

<link rel="stylesheet/less" type="text/css" href="styles.less" />

Then download less.js from the top of the page, and include it in the <head> element of your page, like so:

<script src="less.js" type="text/javascript"></script>

Make sure you include your stylesheets before the script.

This method will cause the less-file act as a regular css-file so no additional files are needed.

This is not a good practice for production environments though. You should compile your less-file to css-file and include it in your <head>-section as is without any less- or js-files.

Henri Hietala
  • 3,021
  • 1
  • 20
  • 27
  • 1
    Running locally on windows 10, trying the above causes this error in Chrome: `Failed to load file:///C:/Users/my_dir/my-theme.less: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https`. – user1063287 Apr 21 '18 at 07:22
2
@import "styles.less";

OR

@import "styles";

its from ur CSS file.. you just need to include it like

<link rel="stylesheet/less" type="text/css" href="styles.less" />
1

This one helped me ...

<script src="less.js" type="text/javascript"></script>

I was tryin to use only this

<link rel="stylesheet/less" type="text/css" href="styles.less" />
gjqeriqi
  • 695
  • 1
  • 3
  • 8