---
title: "Troubleshoot configuration errors"
section: "build-a-backend/troubleshooting"
platforms: ["angular", "javascript", "nextjs", "react", "react-native", "vue"]
gen: 2
last-updated: "2026-03-25T17:40:00.000Z"
url: "https://docs.amplify.aws/react/build-a-backend/troubleshooting/library-not-configured/"
---
If you are running into a missing configuration or `NoCredentials` error message and have called `Amplify.configure` in your project, your Amplify API is most likely being called before `Amplify.configure`. This can happen in a few different ways. Below are three possibilities you can check to troubleshoot this issue.
## Check 1: Validate that `Amplify.configure` is called in the root of your project
Make sure you are calling `Amplify.configure` in the root file of your project. The root file of your app may be different depending on your frontend framework. The current default for some common frameworks are listed below (if you are not using TypeScript the `ts` and `tsx` extensions would be `js` and `jsx`):
* Vue.js: **src/main.ts**
* React: **src/main.tsx**
* Angular: **src/main.ts**
* Next.js Page Router: **pages/_app.tsx** or **src/pages/_app.tsx**
* Nuxt: **app.vue** (Or in a plugins file, as recommended [here](/vue/frontend/server-side-rendering/nuxt/).)
If you are using the Next.js App Router, you can follow the suggestions in our [Next.js documentation](/[platform]/frontend/server-side-rendering/#configure-amplify-apis-for-server-side-usage) for root-level configuration. Keep in mind that if you are calling any APIs at the module-level (i.e. at the top of your file) in any of the Child components, you may still run into this issue. Continue on the [Check 2](/[platform]/build-a-backend/troubleshooting/library-not-configured/#check-2-move-module-level-amplify-api-invocations) if this is the case.
## Check 2: Move module-level Amplify API invocations
When Amplify APIs are used outside of your application lifecycle, there is a risk that a JavaScript bundler may place that API call before `Amplify.configure`. Module-level function calls (calls at the top-level of a file), are generally evaluated in the order that they are imported.
Below is an example of code that will likely result in a missing configuration or `NoCredentials` error message:
```tsx title="index.ts"
import { Amplify } from 'aws-amplify';
import ComponentX from 'module-fetch-auth';
// fetchAuthSession() in ComponentX executed on import
Amplify.configure();
export default function App() {
return (
);
}
```
```tsx title="module-fetch-auth.tsx"
import { fetchAuthSession } from 'aws-amplify/auth';
fetchAuthSession(); // Will throw "AuthUserPoolException: Auth UserPool not configured."
export default function ComponentX() {
return (
...
);
}
```
This error can also happen when using Next.js Layouts and calling Amplify APIs in child components at the module-level (at the top of your file/module). See below for an example of this issue:
```tsx title="layout.tsx"
import ConfigureAmplifyClientSide from '@/ConfigureAmplifyClientSide';
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<>
{children}
);
}
```
```tsx title="ConfigureAmplifyClientSide.tsx"
import { Amplify } from "aws-amplify";
Amplify.configure(config, { ssr: true });
export default function ConfigureAmplifyClientSide() {
return null;
}
```
```tsx title="page.tsx"
import { fetchAuthSession } from "aws-amplify/auth";
// The layout calls configure, but fetchAuthSession ends up executing first
// Will throw "AuthUserPoolException: Auth UserPool not configured."
fetchAuthSession().then((session) => {
console.log(session);
});
export default function HomePage() {
return (
...
);
}
```
To fix this, we suggest moving all Amplify API calls to within the application lifecycle. For instance, if you are using **React**, you can use the `useEffect` hook for functions that should run before the app is loaded:
```tsx title="index.ts"
import { Amplify } from 'aws-amplify';
import ComponentX from 'module-fetch-auth';
Amplify.configure();
export default function App() {
return (
);
}
```
```tsx title="module-fetch-auth.tsx"
import { type AuthSession, fetchAuthSession } from 'aws-amplify/auth';
import { useEffect, useState } from 'react';
export default function ComponentX() {
const [session, setSession] = useState();
const getSession = async () => {
try {
const currentSession = await fetchAuthSession();
setSession(currentSession);
} catch (error: unknown) {
console.log(error);
}
};
useEffect(() => {
getSession();
}, []);
return (
...
);
}
```
## Check 3: Configure Amplify on each page of a multi-page app
If you are working in a multi-page app, you need to call `Amplify.configure()` for each page/route of your application. We recommend calling `Amplify.configure` in a common source file and importing it into each page.