0

I read this article: https://medium.com/@kitze/configure-create-react-app-without-ejecting-d8450e96196a

I followed its instruction and here is my code: https://github.com/franva/custom-react-scripts

I want to use decorators feature for mobx integration without ejecting, but it just doesn't work even REACT_APP_DECORATORS = true;

Here is the error message:

./src/components/ChatRoom.jsx Syntax error: F:/temp/Playground/my-app/src/components/ChatRoom.jsx: Unexpected token (5:0)

3 | import {observer} from 'mobx-react';

4 |

5 | @observer | ^
6 | class ChatRoom extends Component { 7 | 8 | @observable

halfer
  • 19,824
  • 17
  • 99
  • 186
Franva
  • 6,565
  • 23
  • 79
  • 144
  • It's always easier to configure the environment once you eject the app. Try run `yarn eject` before adding the `babel-plugin-transform-decorators-legacy` package – FisNaN Feb 20 '18 at 03:42

2 Answers2

1

The @decorator is ES7 syntax, you need the transform-decorators plugin to transpile it with babel :

https://babeljs.io/docs/plugins/transform-decorators/

Edit: I just saw you want to use it without ejecting, maybe you have to turn REACT_APP_BABEL_STAGE_0=true too.

Dyo
  • 4,429
  • 1
  • 15
  • 30
  • I did turned on the REACT_APP_BABEL_STAGE_0=true. You can see the source code in my github. Meanwhile, I will try to use transform-decorators.Does it require ejecting project? My intention is not ejecting the project. – Franva Feb 19 '18 at 13:11
  • hi, I tried the transform-decorators plugin, but still it's the same error. – Franva Feb 19 '18 at 13:16
  • Your code is compiling for me, i think you just need to rebuild your dependencies and maybe upgrade your node version. – Dyo Feb 19 '18 at 13:48
  • can you please tell me ur node, npm version? – Franva Feb 19 '18 at 20:22
  • Hi , I tried my code again on a different computer, it works. thanks mate – Franva Feb 19 '18 at 23:59
0

The problem is in my local computer environment.

I tried my code on a different computer and it works.

Franva
  • 6,565
  • 23
  • 79
  • 144