[Bug] data-class="" causes the compiler to break unfortunately

[Intrflex]

Minor bug When and div has a data attribute like data-class the compiler can not compile and reports unexpected token :(

<li> <a class="btn js-waves-off" data-action="toggle" data-class="nav-function-fixed" href="#" title="Lock Navigation"> <i class="ni ni-lock-nav" /> </a> </li>

[Intrflex]

Further testing actually shows its not the data-class.. its the fact i have function inside the class

[JuniorTour]

This is a bug.

Thanks for your feedback.

---

It is caused by use .split('function') for split render function as string:

vue-template-babel-compiler/src/templateCompiler.js

Line 25 in cb23dc9

.split('function')

So the staticRenderFns:

var staticRenderFns = [function () {
  var _vm=this;
  var _h=_vm.$createElement;
  var _c=_vm._self._c||_h;

  return _c('div', {
    attrs: {
      "id": "app"
    }
  }, [_c('a', {
    attrs: {
      "attr": "function"
    }
  }, [_vm._v("1")])]);
}];

will be split wrongly by getArrayItems(compiledStaticRenders) into:

---

Solution:

1. Maybe we can use a more accurate Regular expression to parse render function?

2. We can add /* staticRenderSeperator */ during staticRenders.map(), and split functions more accurate:
   

   vue-template-babel-compiler/src/templateCompiler.js

   Line 42 in cb23dc9

   code += `var staticRenderFns = [${staticRenderFns.map((render) => toFunction(render, isFunctional))}]`

Welcome for Pull Request! Feel free to ask anything

There is also a CONTRIBUTING.md you can follow.

[JuniorTour]

@Intrflex We have fixed this issue!

You can try it by run:
npm install vue-template-babel-compiler@latest

Thanks for your feedback again!