Scott Scott - 3 months ago 60
React JSX Question

Using MobX observable decorators with create-react-app

The MobX docs tell me I must "use the transform plugin transform-decorators-legacy and make sure it is first in the plugins list", in order for the decorators to work. The MobX boilerplate project suggests I need a

.babelrc
like:

{
"presets": [
"react",
"es2015",
"stage-1"
],
"plugins": ["transform-decorators-legacy", "react-hot-loader/babel"]
}


How do I do that with a create-react-app generated project? Any attempt to use
@
decorators errors. There is no
.babelrc
even after the project is 'ejected'.

Answer

You can not use decorator syntax unless you eject. However, you can use MobX without @ since it is just a syntax sugar.

Dan Abramov has articulated the reason for this

Our position is simple: we add transforms that are either stable enough (like async/await) or heavily used by Facebook (like class properties). Only that lets us be confident in suggesting them, because if something changes in the standard, we’ll write and release a codemod to migrate away from them.

Since we don’t currently use decorators, we don’t take it upon ourselves to provide a migration path if the standard becomes incompatible. Additionally decorators aren’t even officially supported by Babel (-legacy is there for a reason). And when they are configured slightly incorrectly people blame React.

You also might want to look into create-react-app-mobx

Related discussions:

Comments