javascriptreactjs

TypeError: Webpack imported module is not a function


I have a backend that calculates work shifts. I am trying to post some required user input with a module in services/shifts. The getAll method works fine, but posting throws an error

TypeError: _services_shifts__WEBPACK_IMPORTED_MODULE_2__.default.postData is not a function

Shiftservice module:

import axios from 'axios'
const baseUrl = '...'

const getAll = () => {
    const request = axios.get(baseUrl)
    return request.then(response => response.data)
}
const postData = newObject => {
    const request = axios.post(baseUrl, newObject)
    return request.then(response => response.data)
}

export default {getAll, postData}

I have a button that triggers the following calling code on click:

import shiftService from './services/shifts'

  const postData = (event) => {
    event.preventDefault()
    const sampleObject = {
      sampleField: sample
    }
    shiftService
      .postData(sampleObject)
      .then(returnedData => {
        console.log(returnedData)
      })
}

When execution reaches shiftService.postData, the error is thrown.

I am really confused since I am basically copying some older project of mine which works, but here I just don't find the problem. Thank you in advance for helping a newcomer!


Solution

  • Okay, I am embarrassed of the solution. I was just editing an earlier version of shiftService from a wrong folder, and the imported service only had the get method in it...

    So my code actually works if placed correctly. Thank you for your time, and thanks for sharing alternative ways that must work aswell.