vue render函数 return (<li></li>) 报错

Question

我在打算在npm包里拿出一些组件来研究下，
然后拷贝出来，引入，结果
有些包里的代码是这样的：

 render() {
      return (
        <div class={portalTargetClass} style={portalTargetStyle} data-instance-id={instance.getInstanceId()}>
          <Menu ref="menu" />
        </div>
      )
    },

打包的之后，return 这里报错

Syntax Error: Unexpected token

可是为什么放在npm包里不会报错呢？我又应该怎么改呢？

Answer 1

你需要的是JSX，参考官网文档：https://cn.vuejs.org/v2/guide...
JSX详情参考：https://github.com/vuejs/babe...

Answer 2

我怎么感觉这是 react 的组件呢。

Answer 3

render方法返回createElement函数，要在createElement中生成模版

render (createElement) {
    return createElement(
      'div',
      {
        class: portalTargetClass,
        style: portalTargetStyle
      }
    )
  }

Answer 4

你是怎么打包的呢，相关的babel插件是不是没有配