title: How to use symbol as a var in less?
body: <p>The flex properties are too orderless.
  I wanna write a less function to fix this problem.
  just like:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.flex(@grow:1,@shrink:1,@basis:auto){
   flex-grow:@grow;
   flex-shrink:@shrink;
   flex-basis:@basis;
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>About the "order" and "align",I want use a symbol-pre var,just like:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>//function======================
  .flex(@order){
   @number:replace(@order,#,);
   order:@number;
  }
  
  
  //usage======================
  .test{
    .flex(#2);
  }
  
  //result======================
  .test{
    order:2;
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>How to realize this?
  Thanks a lot.</p>