Exported function is undefined

Question

I'm facing an issue with my Mocha tests in Typescript, I fear it is related to Babel, but I am really not sure what's happening.

Essentially, I have a function that is being exported in a file

// src/my-ts-lib/tests/components/factoryMocks/componentConfigMocks.ts

...

export function getRandomConfig(type?: string): ComponentConfig {
  const randomComponentType = type || randomType();
  return {
    type: randomComponentType,
    config: configLibrary[randomComponentType]
  }
}

And being imported in another, which is being called by a test:

// src/my-ts-lib/tests/components/RouteComponent/mocks/routeMocks.ts

...

import { getRandomConfig } from '../../factoryMocks/componentConfigMocks';

..

export const getSingleRouteConfigMock = (componentType?: string): RouteProps => {
  const defaultComponentType = 'PageLayout';
  return {
    childComponent: {
      type: componentType || defaultComponentType,
      config: getRandomConfig(componentType || defaultComponentType)
    },
    pageName: randomString(),
    path: randomString(),
  };
};

...

When running the tests, I get the following error:

RouteCompnent/mocks/routeMocks.ts:10
      config: getRandomConfig(componentType || defaultComponentType),
                                           ^
TypeError: componentConfigMocks_1.getRandomConfig is not a function
    at Object.exports.getSingleRouteConfigMock (/Users/.../routeMocks.ts:10:44)

If I comment the call and console.log(getRandomConfig) I can see that it is undefined . I do not know why this is happening. What's even weirder is that, in subsequent tests that call getSingleRouteConfigMock , this same console.log correctly outputs the function, meaning that it has been exported then.

I've fiddled around with Babel, Mocha, and Typescript configs but have had no success.

Here's the Babel config:

.babelrc

{
  "presets": ["@babel/preset-env", "@babel/preset-react"]
}

The Mocha config:

mocha.opts

--require ts-node/register
--watch-extensions ts tsx
--require source-map-support/register
--recursive
--require @babel/register
--require @babel/polyfill
src/**/*.spec.**

And the Typescript config:

tsconfig.json

{
   "compilerOptions": {
     "outDir": "./dist/",
     "sourceMap": true,
     "noImplicitAny": false,
     "module": "commonjs",
     "target": "es6",
     "jsx": "react"
   },
   "include": [
     "./src/**/*"
   ],
   "exclude": [
     "./src/**/*.spec.ts",
     "./src/my-ts-lib/components/**/*.spec.tsx",
     "./src/my-ts-lib/test-helpers/*"
   ],
 }

And the relevant sections of the package.json

...
"dependencies": {
  ...
  "@babel/polyfill": "7.2.x",
  ...
},
"devDependencies": {
  "@babel/core": "7.2.x",
  "@babel/preset-env": "7.2.x",
  "@babel/preset-react": "7.0.x",
  "@babel/register": "7.0.x",
  "babel-loader": "8.x",
  "mocha": "3.2.x",
  ...
}

Answer 1

I found out I have a circular dependency. That's why this was not working.

Answer 2

Another possible cause for this symptom is that the function is actually missing in the module when you use a bundler like Parcel in production mode and it removes unused items (that particular issue discussed at Empty Javascript File When Building With Parcel JS 2 ). Check the compiled module file and make sure that the name exists.