Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
226 views
in Technique[技术] by (71.8m points)

javascript - Is it possible to declare LESS variables in the HTML <head>?

Is it possible to declare LESS variables in the HTML and use the declared vars in a seperate .less file.

I want to do something like this:

<html>
<head>

<style type="text/less">
  @MYVAR: #9BC509;
</style>

<!-- use MYVAR inside the main.less file -->
<link rel="stylesheet/less" type="text/css" href="styles/less/main.less">

</head>
...
</html>

EDIT:

Since this did not work and was not a clean solution, I restructured my project, and now do a normal less file @incude for the variables I need. The less file is dynamically written to disc with database values by the django templating engine (and chached for better performance).

To all the downvoters. I don't really get your point! You didn't even write why you downvoted. I case you did not get what I was aiming for, here is the question I should have asked for "slow-thinkers":

How can I achieve including less variables declared in the <head></head> to be available in a seperate less file? But anyways this is just for people hitting this post at some point... As I said I chose another solution.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

You can do this by defining your variables in the globalVars property of a global less object. You should declare the less object before calling the less.js compiler, see also: http://lesscss.org/usage/#using-less-in-the-browser

<link rel="stylesheet/less" type="text/css" href="global.less">
<script>
    var less = {
    globalVars: {
      color: 'red',
      width: '15px'
    }
    }
</script>
<script src="js/less.min.js" type="text/javascript"></script>

The preceding enables you to use @color and @width in the Less code of global.less.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...