ReactJS + electron. Where is the mistake?

Question

React

Good day! A month ago I left the React project and decided to finish it, but for some reason I constantly get an error when processing the syntax.

bundle.js:1 SyntaxError: /home/dikiigr/MEGA/Uneversity/3 Курс/Визуальное программирование/Pomidoro Timer/app/index.js: Unexpected token (22:2) while parsing file: /home/dikiigr/MEGA/Uneversity/3 Курс/Визуальное программирование/Pomidoro Timer/app/index.js

package.json

{
  "name": "pomidoro-timer",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "start": "electron .",
    "watch-js": "watchify app/index.js -t babelify -o public/js/bundle.js --debug --verbose",
    "watch-sass": "node-sass -w src/ -o public/css/",
    "watch": "npm run watch-js & npm run watch-sass"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/dikiigr/desktop-pomidoro-timer.git"
  },
  "keywords": [
    "pomidoro-timer"
  ],
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/dikiigr/desktop-pomidoro-timer/issues"
  },
  "homepage": "https://github.com/dikiigr/desktop-pomidoro-timer#readme",
  "dependencies": {
    "babel-preset-es2015": "^6.13.2",
    "babel-preset-react": "^6.11.1",
    "babel-preset-stage-0": "^6.5.0",
    "babelify": "^7.3.0",
    "electron-context-menu": "^0.4.0",
    "electron-prebuilt": "^1.3.3",
    "electron-reload": "^1.0.2",
    "jquery": "^3.1.0",
    "node-sass": "^3.8.0",
    "react": "^15.3.0",
    "react-dom": "^15.3.0",
    "react-redux": "^4.4.5",
    "react-router": "^2.6.1",
    "react-router-redux": "^4.0.5",
    "redux": "^3.5.2",
    "redux-thunk": "^2.1.0",
    "watchify": "^3.7.0"
  },
  "devDependencies": {
    "debug-menu": "^0.4.0",
    "node-sass": "^3.8.0"
  }
}

index.js

import React from 'react';
import ReactDOM from 'react-dom';
import { createStore, combineReducers, applyMiddleware } from 'redux';
import { Provider } from 'react-redux';
import { hashHistory } from 'react-router';
import { syncHistoryWithStore, routerReducer } from 'react-router-redux';
import { taskListReducer } from './reduces/TaskListReducers';
import { timerReducer } from './reduces/TimerReducers';
import { settingsReducer } from './reduces/SettingReducer';
import * as localStore from './utils/LocalStorage';
import App from './containers/App';

const store = createStore(combineReducers({taskList: taskListReducer, timer: timerReducer, settings: settingsReducer, routing: routerReducer}), localStore.get());
const history = syncHistoryWithStore(hashHistory , store);

function newState() {
  let state = store.getState();
  localStore.set(state, ['timer', 'taskList', 'settings']);
}

ReactDOM.render(
  <Provider store={store}>
    <App history={history} />
  </Provider>,
  document.getElementById('root')
);

store.subscribe(newState);
newState();

I suspect that the error is in the packages or transfer parameters of the babel script. It finds a syntax error at the location of ReactDOM.render. Tried to pure call App without Provider same error

Answer 1

Judging by the error, babel cannot convert "react-component" and for it "<" (22:2 - the first character in the string <Provider..., and also if you removed the first character in <App...) - this is not valid code.
Add the "react" preset to the settings file, (or create with similar content)

{
  "presets": ["es2015", "stage-0", "react"],
}