Uncaught TypeError: useOktaAuth is not a function

Questions
1

Hello, I have adapted the custom-login project from GitHub - okta/samples-js-react: React Auth SDK sample to use TypeScript (3.8.3). I am running into an issue when I turn on “esModuleInterop” option where navigating to the Login page returns a console error stating “Login.tsx:27 Uncaught TypeError: useOktaAuth is not a function”.

So far I have made minimal changes to the project other than adding the following tsconfig file and some supporting packages for it.

{
  "compilerOptions": {
    "outDir": "./dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es6",
    "jsx": "react",
    "esModuleInterop": true,
  }
}

What’s odd is that the Home component, using the base route, also imports the “useOktaAuth” object without error. Within the Login component, I’ve attempted multiple ways of importing including:

import useOktaAuth from '@okta/okta-react';
import * as useOktaAuth from '@okta/okta-react';
import { useOktaAuth } from '@okta/okta-react';

Everything seems to work fine with “esModuleInterop” turned off, but I need this for some other packages I intend to use in the future. Once I set “esModuleInterop” to true, I begin to receive the error.

I would be happy to upload my code! Just let me know, thanks!

error
error1314×803 66.9 KB

2

@turkeymaster77 You can open a support ticket through an email to support@okta.com. One of our dev support engineers will help you take a look. It is easier to upload your code and discuss code issue via a ticket.

3

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.