使用mobx-react的Provider 注入的store 里面都是空的

[appbanana]

各位大神指导一下,为什么我注入的store都是空的对象?
源码如下:

import React, { Component } from 'react';
import { HashRouter } from 'react-router-dom'

import './App.css';
import {Provider} from "mobx-react"
import Home from './page/home'
import stores from './mobx/index'

class App extends Component {
  render() {
    console.log(stores)
    
    return (      
      <Provider {...stores}>
        <HashRouter>
          <div className="App">
              <Home/>
          </div>
        </HashRouter>
      </Provider>
    );
  }
}

export default App;

这个是store.js内的代码

import ChangeNameStore from './ChangeNameStore'
import CountStore from './CountStore'
import RouterStore from './RouterStore'


class Store {
  constructor() {
      this.changeNameStore = ChangeNameStore
      this.countStore = CountStore
      this.routerStore = RouterStore
  }
}

// export default new Store()
const store = new Store()
export default store

这个是CountStore.js里的代码,其他几个store也是类似的只是在做简单测试

import {observable, action} from 'mobx'

class CountStore {

    @observable startNum = 10

    @action
    inc() { this.startNum += 1 }

    @action
    dec() { this.startNum -= 1}

    @action
    reset() { this.startNum = 0 }
}

const countStore = new CountStore();
export default countStore

[appbanana]

.babel 配置有问题
原先的是

{
  "presets": [
    "env", 
    "react",
    "react-app"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-decorators-legacy"
  ]
}

正确的配置

{
  "presets": [
    "env", 
    "react",
    "react-app"
  ],
  "plugins": [
    "transform-decorators-legacy",
    "transform-class-properties"
  ]
}