Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support reading less options from its script tag data attributes #2243

Merged
merged 4 commits into from
Oct 23, 2014

Conversation

lejenome
Copy link
Contributor

add support to reading less script tag data attr like this:

<script defer data-file-async="true"  data-verbose="false" data-log-level="1" src="js/libs/less.min.js" type="text/javascript"></script>

it is more easier and cleaner.

if you found this useful, I will send an extra commit that will add support to read data attributes from less files link tag too (useful it needs some specific options per less file like following)

<link data-dump-line-numbers="all" data-relative-urls="true" data-global-vars='{ myvar: "#ddffee", mystr: "\"quoted\"" }' rel="stylesheet/less" type="text/css" href="less/styles.less">

@lukeapage
Copy link
Member

Nice idea. Will have a think but am initially keen on it.

@jonschlinkert
Copy link
Contributor

agreed, would be nice!

@lukeapage
Copy link
Member

@seven-phases-max What do you think?

@seven-phases-max
Copy link
Member

Assuming it's relatively lightweight, why not?

@lukeapage
Copy link
Member

@lejenome We'll take your other commit too, please, so this also applies to less tags

@lejenome
Copy link
Contributor Author

done

lukeapage added a commit that referenced this pull request Oct 23, 2014
Support reading less options from its script tag data attributes
@lukeapage lukeapage merged commit bbbbd5d into less:master Oct 23, 2014
@lukeapage
Copy link
Member

thanks then!
Would you like to make a pull request with some documentation to less-docs?

@lejenome
Copy link
Contributor Author

I would but my English really sucks
just some notes:

  • importance level: window.less < script tag < link tag
  • data attributes names are not camelCase (e.g logLevel -> data-log-level)
  • link tag options are just render time options (e.g verbose, logLevel, ... are not supported)
  • non-string data attributes values should be JSON valid (e.g use double quotes instead of single quotes like in data-global-vars='{ myvar: "#ddffee", mystr: "\"quoted\"" }')

@lukeapage
Copy link
Member

No problem, myself or someone else will get round to it.

@lukeapage
Copy link
Member

docs added: less/less-docs@ebf87fc
will go live when next version released.

@kirill-konshin
Copy link

This conflicts with RequireJS's data-main attribute on line JSON.parse(tag.dataset[opt]) because tag.dataset[opt] is not JSON, it is a link to another JS file:

<script data-main="js/main.js" src="bower/requirejs/require.js" type="text/javascript"></script>

Instead of going through all options at least check for only known ones:

var stringOptions = ['env', 'dumpLineNumbers', 'rootpath', 'errorReporting',
    jsonOptions = ['...'];

// ...

if (stringOptions.indexOf(opt) != -1) {
    options[opt] = tag.dataset[opt];
} else if (jsonOptions.indexOf(opt) != -1) {
    options[opt] = JSON.parse(tag.dataset[opt]);
} else {
    // do nothing
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants