Module parse failed: Unexpected token (140:4)

[kevinli-webbertech]

I have a reactjs project from kickstarter,
use atom in my project the simplest one, start the project and get the following,

./node_modules/recoil/es/recoil.js
Module parse failed: Unexpected token (140:4)
You may need an appropriate loader to handle this file type.
| state: 'hasValue',
| contents: value,
| ...loadableAccessors,
|
| getValue() {

open recoil.js at 140, it does not like spread attribute,

function loadableWithValue(value) {
// Build objects this way since Flow doesn't support disjoint unions for class properties
return Object.freeze({
state: 'hasValue',
contents: value,
...loadableAccessors,

any idea to fix it?

[drarmstr]

Is this perhaps a JS target version issue? Can you transpile it? See #1073

[kevinli-webbertech]

No, does not seem so, I use chrome, here is package.json, any idea?

(base) xiaofengli@xiaofengmac webapp % vi package.json

"@material-ui/icons": "^4.11.2",
"@testing-library/jest-dom": "^5.11.10",
"@testing-library/react": "^11.2.6",
"@testing-library/user-event": "^12.8.3",
"axios": "^0.21.1",
"bootstrap": "^4.6.0",
"node": "^16.6.1",
"react": "^17.0.2",
"react-bootstrap": "^1.5.2",
"react-dom": "^17.0.2",
"react-icons": "^4.2.0",
"react-router-dom": "^5.2.0",
"react-scripts": "^4.0.3",
"recoil": "^0.4.0",
"styled-components": "^5.3.0",
"web-vitals": "^1.1.1"

},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"react-floating-button-menu": "^2.1.1"
}
}
~

[kevinli-webbertech]

I re generated the package.json by re creating a project, this time, I run the todo example, it works.

{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"web-vitals": "^1.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}