当我用<provider>包装应用程序时，元素类型无效

Question

尝试用<App>包装<Provder>时出现错误，这是代码

import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from 'redux';
import { Provider } from 'react-redux';

import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
import reducer from './store/reducer';

const store = createStore(reducer);

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

这是我使用<Provider>后收到的错误：

这是我的package.json：

{
  "name": "react-complete-guide",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.7.0",
    "react-dom": "^16.0.0",
    "react-redux": "^6.0.0",
    "react-scripts": "1.0.13",
    "redux": "^4.0.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

最后，我意识到这可能与我的package.json中的版本冲突有关，但是现在不管我更新每个软件包多少我都无法解决，我还尝试了其他线程中建议的常见修复有类似的问题，但仍然没有运气。 谢谢。

更新01：
App.js :

import React, { Component } from 'react';

import Counter from './containers/Counter/Counter';
import './App.css';

class App extends Component {
  render() {
    return (
      <div className="App">
       <Counter />
      </div>
    );
  }
}

export default App;