amplify-js: Auth Error: Amplify has not been configured correctly using Nuxt.js

I 'm having the same issue in "aws-amplify": "^3.0.11"

I found out Auth module didn’t load configs of aws-exports, so my solution for this issue is:

import Amplify from '@aws-amplify/core'
import { Auth } from '@aws-amplify/auth'
import awsconfig from './aws-exports'

Amplify.configure(awsconfig)
Auth.configure(awsconfig)

Auth module can load awsconfig directly by Auth.configure(awsconfig)

I don’t understand why Auth module didn’t load aws-export from Amplify.configure, but I resolve this issue by this solution for now.

Still having the same issue. Any help ? Thanks

Still getting this issue with version 3.4.29 in a next.js project. If someone finds a working version please let me know.

My configuration looks like:

// pages/_app.tsx

import Auth from '@aws-amplify/auth';

Auth.configure({
  mandatorySignIn: false,
  region: REGION,
  userPoolId: USER_POOL_ID,
  identityPoolId: IDENTITY_POOL_ID,
  userPoolWebClientId: USER_POOL_CLIENT_ID,
});

In development everything works fine, once I deploy to production I get this error:

The code quality on AWS Amplify (or lack thereof) blows me away. How AWS sells this is beyond me.

Amplify’s whole purpose is to ease integration of a suite of services and improve productivity. When our teams fight the framework’s quality on basics like this, it not only erases any efficiency, speed, and cost benefit for us, it hampers our ability to execute and costs us more.

If we had back in developer time what we have spent in wasted time fighting the framework’s atrocious quality and reliability it’d be more than our entire AWS bill.

Nothing is perfect nor should it be or can it be, but this was the worst architectural decision I’ve made in a long time to have our teams on this. The promise was there, the idea is great, but the execution is of the utmost worst quality with a fragmented universe of packages, deps, and inconsistencies that are bad enough without all the random bugs, but are even worse when they don’t work well together because the UI frameworks don’t jive with the core, etc, etc.

How in the world do builds that are so badly broken in relatively common environments make it to release so often and consistently with Amplify? I don’t mean to sound harsh, but we all know the world’s supposed cloud leader and largest provider in the world can easily do better, and Amplify isn’t a particularly bleeding edge product, but it is pretty important for developer productivity & customer productivity, and any quality issue in it cascades into applications built upon and with it. And these elementary issues have been going on for years now, why can’t AWS get control of the quality here on releases?

In what world is this acceptable?

And it’s been this way for years, and it doesn’t have to be this bad! It’s not like it’s a new area of medicine we’re needing to make discoveries in for decades to come and we’re gonna crawl before we walk, this is a collection/glue offering of other production-grade services in highly established languages with very well-defined interfaces in an ecosystem AWS completely controls on its own, 100%, and we can’t even keep the most basic level of functionality from suffering regressions, let alone stopping new bugs that always crop up!

@swaminator - can you give us and/or our support rep some resources to address this, but more importantly, discuss and share what the quality plan here is. We all know Amplify doesn’t need to be this bad, why is it? And what are you doing to change that? When will this happen? I have to say (esp also being a Google Cloud, Firebase, and Azure Mobile Apps [etc] customer), Amplify ranks as the biggest mistake I’ve made as a technology executive in choosing a platform. Any possible value add from the product vision (which is GREAT) is completely destroyed and orders of magnitude dumped into the negative with the myriad of issues. If we didn’t already have so much invested in it we would be GONE, but we are quickly reaching the point where it is becoming such an impediment to productivity, it will actually make more sense in schedule and finance to bite the bullet and migrate a different framework that actually makes good on its developer productivity and management productivity story rather than adding a whole other layer of madness, expense, delay, unpredictability, and risk.

And don’t miss the party over at #7555, either!

I tried above solution:

import Amplify from '@aws-amplify/core'
import { Auth } from '@aws-amplify/auth'

The same issue still happens, error:

Error: Amplify has not been configured correctly. 
            The configuration object is missing required auth properties. 
            Did you run `amplify push` after adding auth via `amplify add auth`?
            See https://aws-amplify.github.io/docs/js/authentication#amplify-project-setup for more information

version:

“aws-amplify”: “^3.0.11”

this is soooo shit… amplify never registers auth. it will register everything that i dont need except auth. Because when auth initialises it’s using a different instance of amplify ! brilliant.

 Amplify.configure = function (config) {
        var _this = this;
        if (!config)
            return this._config;
        this._config = Object.assign(this._config, config);
        logger.debug('amplify config', this._config);
        this._components.map(function (comp) {
            comp.configure(_this._config);
        });
        return this._config;

So, even though i am passing auth config, because its not a registered component. it never gets configured.

This issue should be reopened

I first ran into it nearly two years ago and the amplify team seems unable to answer or help the issue so far.

We really need this resolved, please and thank you

This issue should not be closed until proper documentation of Auth.configure(config); is available. Please see: https://aws-amplify.github.io/amplify-js/api/#configuration

Why is this ticket closed after this comment?

Ctrl + F & Searching ‘.configure()’ shows you a bit about it being a function but not much about:

• What format the config must be
• Refresh Handlers (the refresh subkey function callback for federated signing, when is it called, how do I catch if it fails etc.)
• Auth.configure vs Amplify configure

https://aws-amplify.github.io/amplify-js/api/#configuration

I 'm having the same issue in "aws-amplify": "^3.0.11"

I found out Auth module didn’t load configs of aws-exports, so my solution for this issue is:

import Amplify from '@aws-amplify/core'
import { Auth } from '@aws-amplify/auth'
import awsconfig from './aws-exports'

Amplify.configure(awsconfig)
Auth.configure(awsconfig)

Auth module can load awsconfig directly by Auth.configure(awsconfig)

I don’t understand why Auth module didn’t load aws-export from Amplify.configure, but I resolve this issue by this solution for now.

solved my problem, in Aug 2020 👍

@Johnniexson Check #5671 , when you don’t import aws-amplify.Auth, you may also get this error. Solution is to import it anywhere inside the project

import {Auth} from 'aws-amplify';

Importing Auth from aws-amplify worked, but I had to import the Amplify object itself from @aws-amplify/core like:

import Amplify from '@aws-amplify/core';
import { Auth } from 'aws-amplify';

Otherwise, I was getting the same issue as everyone else. So +1 for the above stated solution.

Well, I am using ionic (angular) with amplify and this bugged me too. Therefore, I had to update my main.ts file with the following,

import Amplify from 'aws-amplify';
import aws_exports from './aws-exports';

Amplify.configure(aws_exports);

The above code does what the error asks for. Unfortunately there are a lot of issues with the Amplify Framework and I don’t think this is production ready at all.

Same issue here, aws-amplify 2.2.6

Updating to "aws-amplify": "^2.2.0" solved the issue for me.

Having this issue with 3.3.14, amazing stuff! Loving the consistency

It seems more so related to changing versions, not a specific version tbh, but not sure on the root cause

Edit:

I ended up adding the below as per above, in addition to having Amplify.configure already setup:

import { Auth } from ‘@aws-amplify/auth’ Auth.configure(awsconfig)

I also had to do the same with other modules, eg. with Api: import { API } from “aws-amplify”; API.configure(aws_exports);

Why is this all of a sudden required? Why is doing Amplify configure insufficient?

Resolving as above statement that the resolution is to upgrade to `"aws-amplify: “^2.2.0”

I’m having this issue… aws-amplify v2.2.6

I 'm having the same issue in "aws-amplify": "^3.0.11"

I found out Auth module didn’t load configs of aws-exports, so my solution for this issue is:

import Amplify from '@aws-amplify/core'
import { Auth } from '@aws-amplify/auth'
import awsconfig from './aws-exports'

Amplify.configure(awsconfig)
Auth.configure(awsconfig)

Auth module can load awsconfig directly by Auth.configure(awsconfig)

I don’t understand why Auth module didn’t load aws-export from Amplify.configure, but I resolve this issue by this solution for now.

Worked.
After a year this solution still saved my ass. Thanks.

Just a reminder, if you didn’t manage to set the .env properly, there would be the same error in your console.
So maybe we could try to write some fixed string value to replace the awsconfig and have a try first.

Often mistake for .env:

• not following the app required prefix: for example, react need REACT_APP_ and vue need VUE_APP_.
• not re-serving the app after made the adjustments on .env.
• added unnecessary " or ' for the string env value.

Hope it helps.

This issue should not be closed until proper documentation of Auth.configure(config); is available. Please see: https://aws-amplify.github.io/amplify-js/api/#configuration

I just resolved this in my project by calling Auth.configure() within ALL files that Auth is used.

Reason is during aws-amplify minor version upgrade it changed required @aws-amplify/auth version. But also @aws-amplify/ui-component requires @aws-amplify/auth. So if you allow range versions of aws-amplify (for example ^), you can have updated aws-amplify package (newer minor versions), which required different @aws-amplify/auth package than @aws-amplify/ui-components package. As a result in ui you have two different @aws-amplify/auth packages imported - one from configuring aws-amplify, and second from using @aws-amplify/ui-components (this library is used by for example @aws-amplify/ui-react, etc). So ui components have their own auth module, which doesn’t know anything about being configured - that’s where error comes from. In my case solution was to reinstall all amplify libraries to newest versions (note that @aws-amplify/ui-* libraries changed from 0.* versions to 1.* versions), so that they don’t import @aws-amplify/auth module twice.

@cybercussion that worked for me too, thanks for sharing. Why do we have to spend so much time with this? Why didn’t I choose firebase???

The solution for me was to to add mode: "spa", to my nuxt.config.js file.

Using Nuxt in SPA mode generally defeats the purpose of using Nuxt for 99% of people.

This is still an issue for me using aws-amplify: ^4.3.1

So is it safe to say @aws-amplify works but aws-amplify has issues? I think I’ve had this in use now for 7 months and just started having issues. I don’t know the difference between node_modules but I was seeing a lot of extra files get created on builds. I guess I need to look if its a legacy vs new thing or a case where its a ‘owned’ package and prior it wasn’t? Should we even be installing the aws-amplify vs @aws-amplify?

I previously had:

Amplify.configure(awsconfig);
// now I have to also
Auth.configure(awsconfig);
// made the error go way

https://stackoverflow.com/questions/63838978/moving-aws-exports-js-to-another-angular-project/63848309#63848309

I was looking for this same issue, but in React.js, not Nuxt.js. The following has resolved this issue on my end, given that you use hook-based functional components in React with "aws-amplify": "^3.0.10" and "@aws-amplify/ui-react": "^0.2.9".

TL;DR: Load Amplify.configure where your app initializes.

// App.tsx
import Amplify from "aws-amplify";
import { withAuthenticator } from "@aws-amplify/ui-react";

function App() {

  useEffect(() => {
    Amplify.configure({
      Auth: {
        region: process.env.REACT_APP_AWS_PROJECT_REGION,
        identityPoolId: process.env.REACT_APP_AWS_COGNITO_IDENTITY_POOL_ID,
        identityPoolRegion: process.env.REACT_APP_AWS_COGNITO_REGION,
        userPoolId: process.env.REACT_APP_AWS_USER_POOLS_ID,
        userPoolWebClientId: process.env.REACT_APP_AWS_USER_POOLS_WEB_CLIENT_ID,
      },
    });
  }, []);

  return <div/>;
}

export default withAuthenticator(App);

# .env
REACT_APP_AWS_PROJECT_REGION=<value_here>
REACT_APP_AWS_COGNITO_IDENTITY_POOL_ID=<value_here>
REACT_APP_AWS_COGNITO_REGION=<value_here>
REACT_APP_AWS_USER_POOLS_ID=<value_here>
REACT_APP_AWS_USER_POOLS_WEB_CLIENT_ID=<value_here>

I found out Auth module didn’t load configs of aws-exports, so my solution for this issue is:

Still didn’t fix the error display for me (the actual authentication process works). I’m including only the aws-exports file following the instructions on Multiple frontends.

Same "aws-amplify": "^3.0.11".

Same happens using the slightly different re-use-existing-authentication-resource approach.

I have not solved this issue, however I’m using nuxt in Generate mode when deployed so I’m not actually worrying about it.

The error is being thrown by Nuxt SSR, so if you’re not using SSR then it shouldn’t actually be a problem when deployed.

Even in SSR mode you can accomplish everything client side, you can then store the JWT token as a cookie so that you have access to it server side.

The annoying part is constantly seeing the error in dev tools anytime you refresh (only in SSR mode, error goes away in Generated or SPA mode).

Just ran into this with aws-amplify 3.3.14 and @aws-amplify/ui-react 0.2.34. Updated a functioning app from 3.3.13 and 0.2.33 and suddenly this error is popping up on the withAuthenticator login page.

@Johnniexson Check #5671 , when you don’t import aws-amplify.Auth, you may also get this error. Solution is to import it anywhere inside the project

import {Auth} from 'aws-amplify';

I also have this same problem!

In my case, the error came from using Auth.currentAuthenticatedUser when trying to determine if a federated user is logged in or not.

If amplify can’t find a federated user, it falls back to trying to find a userpool user, and eventually fails here.

I think this should probably be changed from:

if (!config.userPoolId || !config.identityPoolId) {
    return AuthErrorTypes.MissingAuthConfig;
}

to:

if (!config.userPoolId && !config.identityPoolId) {
    return AuthErrorTypes.MissingAuthConfig;
}

So it doesn’t short circuit if userPoolId isn’t provided.

The error is annoying but ultimately doesn’t impact my the functionality 🤷‍♂️

Reason is during aws-amplify minor version upgrade it changed required @aws-amplify/auth version. But also @aws-amplify/ui-component requires @aws-amplify/auth. So if you allow range versions of aws-amplify (for example ^), you can have updated aws-amplify package (newer minor versions), which required different @aws-amplify/auth package than @aws-amplify/ui-components package. As a result in ui you have two different @aws-amplify/auth packages imported - one from configuring aws-amplify, and second from using @aws-amplify/ui-components (this library is used by for example @aws-amplify/ui-react, etc). So ui components have their own auth module, which doesn’t know anything about being configured - that’s where error comes from. In my case solution was to reinstall all amplify libraries to newest versions (note that @aws-amplify/ui-* libraries changed from 0.* versions to 1.* versions), so that they don’t import @aws-amplify/auth module twice.

Thanks padzikm, that worked for me! I ran: yarn add @aws-amplify/ui-react@latest and bingo back in. Half a day wasted, ho hum

Same here, after running: rm -rf package-lock.json node_modules npm add aws-amplify@latest

And adding this to all files importing @aws-amplify/core or @aws-amplify/auth, it started working again. Auth.configure(AwsConfig);

I also come across this error today:

Error: Amplify has not been configured correctly. 
            The configuration object is missing required auth properties. 
            Did you run `amplify push` after adding auth via `amplify add auth`?

but for no obvious reason. I had been working on a feature branch, the only thing added was a cron job lambda. No frontend stuff at all. Then I merged the feature branch to develop and after that I got this error.

It continued to work locally where I am running amplify 4.41.2 but failed on the hosted version of the same branch.

After adding:

import { Auth } from '@aws-amplify/auth'
Auth.configure(aws_exports)

It started to work on the hosted version as well but these lines were not there before and it was just fine.

@wlee221 this worked for me thanks :

rm -rf package-lock.json yarn.lock node_modules
yarn add aws-amplify@latest

Our issues here were related that some change in 3.4.7 -> 3.4.17 brought up an issue related to duplication with the aws-amplify library that existed from before modularization was used: removing the modularized auth library resolved the issue. Thank you @elorzafe

@sammartinez - can we get this re-opened as this appears to be a regression or should I open a new issue for this (I don’t want to pollute with a new issue if reopening is going to be more appropriate but also don’t want to sit here yammering on a closed issue/just talking to myself)?

We have an AWS Support ticket open against this that’s been forwarded to the service team, so is this redundant or helpful to also have the issue open in GH?

@24601, Can you look to reopen a new issue with your above callout, I want to be able to track this as a new issue. Thanks ahead of time!

Be aware that version 3.3.12 is also bugged, but it’s already fixed in version 3.3.13

3.3.11 was working ok but upgrading to 3.3.13 seemed to introduce the issue again.

I 'm having the same issue in "aws-amplify": "^3.0.11"

I found out Auth module didn’t load configs of aws-exports, so my solution for this issue is:

import Amplify from '@aws-amplify/core'
import { Auth } from '@aws-amplify/auth'
import awsconfig from './aws-exports'

Amplify.configure(awsconfig)
Auth.configure(awsconfig)

Auth module can load awsconfig directly by Auth.configure(awsconfig)

I don’t understand why Auth module didn’t load aws-export from Amplify.configure, but I resolve this issue by this solution for now.

Resolved my issue also that cropped up out of nowhere after an update to aws-amplify@3.2.0. Thanks!

Having exactly the same issue with Nuxt in Universal mode and latest amplify version: 4.25.0 Everything seems to work fine, but the error still appears. I’ve tried all solutions/workarounds proposed here to no avail. Any ideas please?

FYI, my website is in universal mode too and turns out the problem is I was using client mode for the registration of the amplify.js in nuxt.config

Well, afaik amplify works in client mode only, so I’m not sure how it will behave in your case. However, it got me thinking and I’ve changed my authentication plugin to run in client mode as well (not sure why I set otherwise to begin with), which resolved the issue completely. To sum it up, I currently have both amplify.js and my custom auth plugin registered in nuxt.config.js in client mode and the error is finally gone.

Having exactly the same issue with Nuxt in Universal mode and latest amplify version: 4.25.0 Everything seems to work fine, but the error still appears. I’ve tried all solutions/workarounds proposed here to no avail. Any ideas please?

yarn remove aws-amplify

and after

yarn add aws-amplify@latest

helped me