mobx support

[ltkn]

Hi,

First of all thanks for your work.

I don't seem to get mobx working using the latest beta-3 version.

I get
SyntaxError: /home/xxx/xxx.js: Support for the experimental syntax 'decorators-legacy' isn't currently enabled (11:1):

11 | @Inject("rootStore")

My config-overrides.js
const { override, addDecoratorsLegacy, disableEsLint } = require("customize-cra"); module.exports = override( addDecoratorsLegacy(), disableEsLint() );

[walmor]

Hi @ltkn,

What version of the react-scripts are you using? If you're using the version 2.0.3, take a look at my comment here, maybe that can help.

[ltkn]

Hi @walmor,
I saw your comment thanks, yes I'm using 2.0.3, I will give it a try today.

[war3k]

try my fork: https://github.com/war3k/customize-cra

[arackaf]

Hi all! I've fixed my babel plugin method with @walmor's fix (or a version of it that works with the new api, using override). This is released in version 0.1.0-beta4. It's tested on react-scripts latest, and also 2.0.1, and works on both, which is good enough for me. Great fix - thanks!

@ltkn - thanks a ton for the PR, but I had to go with walmor's fix, since it's more backward compatible.

[ltkn]

Credits to @war3k I haven't done the PR ;)

Can't get mobx working with 0.1.0-beta4 and "react-scripts": "2.0.3",

my packages :
"dependencies": {
"customize-cra": "^0.1.0-beta4",
"mobx": "^5.5.0",
"mobx-react": "^5.2.8",
"npm": "^6.4.1",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-helmet": "^5.2.0",
"react-scripts": "2.0.3",
"react-snap": "^1.19.0",
"semantic-ui-react": "^0.82.5",
"serializr": "^1.3.0",
"source-map-explorer": "^1.6.0",
"universal-router": "^6.0.0"
},
"scripts": {
"build-semantic": "cd src/semantic && gulp build-css build-assets",
"watch-semantic": "cd src/semantic && yarn run build-semantic && gulp watch",
"analyze": "source-map-explorer build/static/js/main.*",
"start": "yarn run build-semantic && react-scripts start",
"build": "yarn run build-semantic && react-scripts build && react-snap",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"semantic-ui": "^2.4.0",
"@babel/core": "^7.1.2",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/plugin-proposal-decorators": "^7.1.2",
"@babel/preset-env": "^7.1.0"
},

[arackaf]

Are you disabling eslint?

This is what my config-overrides looks like

const { override, addDecoratorsLegacy, disableEsLint, addBundleVisualizer, addWebpackAlias } = require("customize-cra");
const path = require("path");

module.exports = override(
  addDecoratorsLegacy(),
  disableEsLint(),
  config => (process.env.BUNDLE_VISUALIZE == 1 ? addBundleVisualizer()(config) : config),
  addWebpackAlias({ ["ag-grid-react$"]: path.resolve(__dirname, "src/shared/agGridWrapper.js") })
);

killing eslint is likely necessary for it to parse.

[ltkn]

Yes it's disabled but somehow still get "Support for the experimental syntax 'decorators-legacy' isn't currently enabled". Anyone with the same versions got mobx annotations working ? thanks.

[arackaf]

Let's see your config-overrides file

[ltkn]

const { override, addDecoratorsLegacy, disableEsLint } = require("customize-cra");

module.exports = override(
  addDecoratorsLegacy(),
  disableEsLint(),
  config => (process.env.BUNDLE_VISUALIZE == 1 ? addBundleVisualizer()(config) : config),
);

not sure if I need config => ( line but its there.

[arackaf]

Just to be certain, you ARE using react-app-rewired to run your app, right? So in your package.json, you should have scripts that look something like this:

"start": "react-app-rewired start",
"build": "react-app-rewired build"

[ltkn]

I wasn't ! I did assume this library was a replacement.

It is now working thanks a lot for your help !

[arackaf]

Anytime - I'll update the docs to make this more clear.