codehero's avatar

React class component state unexpected error

Hello,

I have preset react and I defined a class without the constructor setting the state or functions. When I am working with create-react-app without laravel all is fine.

Is there an problem in the .babel configuration? How can I fix this?


export default class Login extends React.Component {

    // super(props){
    //  state = {
    //      loggedIn: false,
    //      form: {
    //          email: null,
    //          password: null
    //      }
    //  };
    // }
    state = {
        loggedIn: false,
        form: {
            email: null,
            password: null
        }
    }
}

The error output


ERROR in ./resources/js/components/auth/Login.js
Module build failed: SyntaxError: auth/Login.js: Unexpected token (17:7)

  15 |  //      };
  16 |  // }
> 17 |  state = {
     |        ^
  18 |          loggedIn: false,
  19 |          form: {
  20 |                  email: null,

 @ ./resources/js/app.js 16:0-34
0 likes
2 replies
ahmeddabak's avatar

Laravel Mix also ships with basic React support. Simply update your mix.js() call to mix.react(), and then use the exact same set of arguments. Behind the scenes, Mix will pull in and reference any necessary Babel plugins for React.

mix.react('resources/js/app.jsx', 'public/js/app.js');

Of course, you'll still want to install React and ReactDOM through NPM, per usual, but everything else should be taken care of.

From the Laravel Mix docs

Please or to participate in this conversation.