How to use the Babel plugin?

I couldn’t find any instructions on how to use the plugin in the documentation. I tried the following:

// .babelrc.json
{
  "plugins": [
    "babel-plugin-jsx-dom-expressions"
  ]
}

And I run it with @babel/cli:

npx babel index.js -o compiled.js

But I keep getting a syntax error because of the JSX:

TypeError: /home/me/library/index.js: Property left of AssignmentExpression expected node to be of a type [“LVal”] but instead got “ArrowFunctionExpression”

How do I use this with Babel?

[ryansolid]

I actually can change this. I was worried about this case:

function MyComp(prop) {
  return <div ref={props.ref} />
}

<MyComp />

If props.ref isn’t passed in I can’t tell if the intention is to assign it or simply it’s missing. But I realized since props are readonly, even if it gets assigned who cares. It just doesn’t update. Right now that scenario is compiled to:

props.ref && props.ref(el)

I can change it to:

typeof props.ref === "function" ? props.ref($el) : props.ref = $el;

While it is meaningless in this case if isn’t passed in. This will also work for a simple ref:

typeof el1 === "function" ? el1($el) : el1 = $el;

Overall it’s more code but it only runs once on creation and I don’t think it makes that much of a difference on size.

[elclanrs]

Thank you, I must’ve missed that part in the docs and just made the assumption. It’d be ideal if it takes both vars and callbacks, but I understand that may be a limitation currently.