手写笔：生成CamelCase变量

Question

希望在新生成的Stylus变量中生成camelCase占位符（后续问题to this one）：

• smallMarginTop
• normalMarginTop

等

properties = margin padding

proportions = mini small normal medium large

for property in properties
    for proportion, i in proportions // Generate basic proportion placeholders: ex. small-padding, medium-padding, etc.
        define("$" + property + proportion, unit(i / 3, "em")) // should give something like $marginSmall = ... -- thinking something like toUpperCase?

如何使用Javascript API或本机在Stylus中实现这一目标？

Answer 1

Stylus中没有to-upper-case函数，但您可以使用JS API和use内置函数轻松添加它。例如：

以-上层case.js

module.exports = function() {
  return function(stylus) {
    stylus.define('to-upper-case', function(node) {
      var nodeName = node.nodeName
        , val = node.string;

      if ('string' == nodeName) {
        return new stylus.nodes.String(val.toUpperCase());
      } else if ('ident' == nodeName) {
        return new stylus.nodes.Ident(val.toUpperCase());
      } else {
        throw new Error('to-upper-case accepts string or ident but got "' + nodeName + '"');
      }
    });
  };
};

<强> test.styl

use('to-upper-case.js')

properties = margin padding

proportions = mini small normal medium large

for property in properties
  for proportion, i in proportions
    define("$" + property + to-upper-case('' + substr(proportion, 0, 1)) + substr(proportion, 1), unit(i / 3, "em"))