Импортируемые функции не определены

Question

Я использую Webpack через Vue CLI и получаю ошибку Error in created hook: "TypeError: _api__WEBPACK_IMPORTED_MODULE_0__.default.$_playerApi_getPlayers is not a function" при попытке использовать свою страницу.

Вот моя древовидная структура:

.
+ main.js
+ app/
|  + api.js
|  + App.vue
|  + players/
|  |  + api.js
|  |  + index.js
|  |  + routes.js
|  |  + components/
|  |  |  + index.js
|  |  |  + Login.vue
|  |  |
|  |  + vuex/
|  |     + actions.js
|  |     + ...
|  |
|  + others/
|     + api.js
|     + ...
|
+ ...

app / Players / Vuex / Actions.js :

import { default as api } from '../../api'

export default {

  loadPlayers({ commit }) {
    return api.$_playerApi_getPlayers().then(response => {  // <--- ERROR LINE
      commit('STORE_PLAYERS', response.body)
      return response
    })
    .catch(error => {
      throw error
    })
  },

  loadPlayer({ commit }, playerId) {
    return api.$_playerApi_getPlayer(playerId).then(response => {
      commit('LOAD_PLAYER', response.data)
      return response
    })
    .catch(error => {
      throw error
    })
  },

  ...

}

приложение / Players / Api.js :

export default {

  ...

  $_playerApi_getPlayer(playerId = '') {
    ...
  },

  $_playerApi_getPlayers() {
    ...
  },

  ...

}

приложение /api.js :

import { api as players } from './players'

export default {
  players,
}

Я почти уверен, что это неправильно (обв.), но не уверен, как заставить его работать должным образом.

Что я делаюздесь не так?Экспорт и импорт кажутся нормальными, но они как-то ломаются, чего я просто не вижу и не отлаживаю.

Я пытался использовать следующее в моем app / api.js , ноэто неправильно, потому что экспорт не является массивом:

import { api as players } from './players'

export default {
  ...players,
}

Я также попытался использовать следующее в моем app / Players / api.js , но это не сработало,либо:

export default {

  methods: {

    ...

    $_playerApi_getPlayer(playerId = '') {
      ...
    },

    $_playerApi_getPlayers() {
      ...
    },

    ...

  },

}

Answer 1

В вашем app/api.js:

import * as players from './players/api'
export default {
  ...players,
} 

и в вашем app/players/api.js:

export function $_playerApi_getPlayer(playerId = '') {
   ...
}

export function $_playerApi_getPlayers() {
   ...
}