npm start not working

[ruthvikdevs]

Hi @azeezolaniran2016 , I'm following the steps here

and when I enter 'npm start' it throws below error.

---

npm start

[email protected] start C:\Users\ruthvikc\ReactDev
babel-node ./server/server.js

C:\Users\ruthvikc\ReactDev\node_modules\babel-core\lib\transformation\file\options\build-config-chain.js:154
throw err;
^

SyntaxError: C:\Users\ruthvikc\ReactDev.babelrc: Error while parsing JSON - Unexpected '�' at line 1 column 2 of the JSON5 data. Still to read: "��{\u0000"\u0000p\u0000r\u0000e\u0000s\u0000e\u0000t\u0000s\u0000"
at error (C:\Users\ruthvikc\ReactDev\node_modules\json5\lib\json5.js:56:25)
at word (C:\Users\ruthvikc\ReactDev\node_modules\json5\lib\json5.js:393:13)
at value (C:\Users\ruthvikc\ReactDev\node_modules\json5\lib\json5.js:493:56)
at Object.parse (C:\Users\ruthvikc\ReactDev\node_modules\json5\lib\json5.js:508:18)
at ConfigChainBuilder.addConfig (C:\Users\ruthvikc\ReactDev\node_modules\babel-core\lib\transformation\file\options\build-config-chain.js:150:65)
at ConfigChainBuilder.findConfigs (C:\Users\ruthvikc\ReactDev\node_modules\babel-core\lib\transformation\file\options\build-config-chain.js:96:16)
at buildConfigChain (C:\Users\ruthvikc\ReactDev\node_modules\babel-core\lib\transformation\file\options\build-config-chain.js:61:13)
at OptionManager.init (C:\Users\ruthvikc\ReactDev\node_modules\babel-core\lib\transformation\file\options\option-manager.js:354:58)
at compile (C:\Users\ruthvikc\ReactDev\node_modules\babel-register\lib\node.js:103:45)
at loader (C:\Users\ruthvikc\ReactDev\node_modules\babel-register\lib\node.js:144:14)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: babel-node ./server/server.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ruthvikc\AppData\Roaming\npm-cache_logs\2018-04-01T08_57_47_527Z-debug.log

[azeezolaniran2016]

@ruthvikdevs could you show the contents of your babel.rc file here?

[ruthvikdevs]

@azeezolaniran2016 - is it babel.rc or .babelrc

{"presets": ["env"]}

[azeezolaniran2016]

Oh okay. After this step "$ echo '{"presets": ["es2015", "react"]}' >> .babelrc", the content should actually be: {"presets": ["es2015", "react"]}.
I wrote the tutorial using a Unix machine. I'm not sure what of what differences/changes you might need using a Windows. I guess we can keep them documented as you create the issues.

[ruthvikdevs]

Initially I've created the same with what is given in the tutorial. I've just updated the babel to latest. That's all and no other change, but I'm still facing the error.

Error is occuring either with es2015 or env. Both

[azeezolaniran2016]

Can you clone the master branch and follow the setup steps just to be certain that the whole project works.

[ruthvikdevs]

If I clone the master branch and run 'npm start', there are no errors. But the screen is blank. I see no calculator in localhost:3030

[azeezolaniran2016]

Yea, run npm run webpack first. This creates the bundle.js file which is the calculator script.

[ruthvikdevs]

Error occurred:

ERROR in ./client/index.js
Module build failed: SyntaxError: C:/Users/ruthvikc/Documents/GitHub/react-calculator/client/index.js: Unexpected token (9:2)

7 | // on the element with id of 'app'
8 | ReactDOM.render(

9 | , // mount our frame component
| ^
10 | document.getElementById('app')
11 | );
12 |

npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] webpack: webpack --config=webpack.config.js
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] webpack script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

[azeezolaniran2016]

Thanks for your patience @ruthvikdevs. I'm afraid I will need to reproduce this on a Windows machine, and hopefully create a fix. I don't have a Windows machine handy right now, but I should have this resolved soon.
Please, could you also state what version of Windows you're running?

[krsunny]

Hi
getting this error
APPLEs-MacBook-Air:react-calculator apple$ npm start

[email protected] start /Users/apple/Desktop/react-calculator
babel-node ./server/server.js

/Users/apple/Desktop/react-calculator/node_modules/babel-core/lib/transformation/file/options/build-config-chain.js:154
throw err;
^

SyntaxError: /Users/apple/Desktop/react-calculator/.babelrc: Error while parsing JSON - Syntax error at line 2 column 1 of the JSON5 data. Still to read: "{"presets": ["es2015"
at error (/Users/apple/Desktop/react-calculator/node_modules/json5/lib/json5.js:56:25)
at Object.parse (/Users/apple/Desktop/react-calculator/node_modules/json5/lib/json5.js:511:13)
at ConfigChainBuilder.addConfig (/Users/apple/Desktop/react-calculator/node_modules/babel-core/lib/transformation/file/options/build-config-chain.js:150:65)
at ConfigChainBuilder.findConfigs (/Users/apple/Desktop/react-calculator/node_modules/babel-core/lib/transformation/file/options/build-config-chain.js:96:16)
at buildConfigChain (/Users/apple/Desktop/react-calculator/node_modules/babel-core/lib/transformation/file/options/build-config-chain.js:61:13)
at OptionManager.init (/Users/apple/Desktop/react-calculator/node_modules/babel-core/lib/transformation/file/options/option-manager.js:354:58)
at compile (/Users/apple/Desktop/react-calculator/node_modules/babel-register/lib/node.js:103:45)
at loader (/Users/apple/Desktop/react-calculator/node_modules/babel-register/lib/node.js:144:14)
at Object.require.extensions.(anonymous function) [as .js] (/Users/apple/Desktop/react-calculator/node_modules/babel-register/lib/node.js:154:7)
at Module.load (module.js:565:32)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: babel-node ./server/server.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/apple/.npm/_logs/2018-05-08T09_46_43_683Z-debug.log