In React programming when we are using the spread operator (…state), we may encounter the error saying Unexpected token. For example below piece of code having …state statement and this will throw an error of Unexpected token. Let us see how to solve this issue in the next section.
Solution One
The simplest way to solve this error can use object.Assign() method. and, the first parameter is creating a brand new object then merging all of the properties of the state object into that new object so hence it returns that as the new state.
Solution Two
In the redux documentation or in any other places you might see “…. State” without Object.Assign() method. Using BABEL syntax we can solve this error without Object.Assign().
When we are using a web pack, babel pre-set is the easiest way to go because it bundles plugins for you. So let’s add this pre-set to our local web pack setup. Then add a preset-5 property to our webpack.config file. Finally, restart the application using npm start and the error should not appear again.
Webpack.config.js file settings
Tip: What is spread operator syntax means in ES5 Javascript
This new syntax is called object spread operator, here we are saying return a new object and copy or spared all the properties that exist on to the currentState object onto this new object and then also define a new property and assign the value of an action. For more information, we can refer to MDN Documentation https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax