createAmplifyAuthAdapter fails because Amplify.geConfig is empty.

[r-3110]

Before creating a new issue, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have tried disabling all browser extensions or using a different browser
• I have tried deleting the node_modules folder and reinstalling my dependencies
• I have read the guide for submitting bug reports.

On which framework/platform are you having an issue?

React

Which UI component?

Storage

How is your app built?

vite

What browsers are you seeing the problem on?

Chrome

Which region are you seeing the problem in?

ap-northeast-1

Please describe your bug.

createAmplifyAuthAdapter fails because Amplify.geConfig is empty.

When I checked the source code, I found that Amplify.getConfig on line 27 retrieves an empty object.

Why does it become empty? My amplify_outputs.json is not empty.

I'm trying it with a minimal implementation as per the official documentation, but I get an error.

However, if I execute Amplify.getConfig myself just before executing createAmplifyAuthAdapter, I can get the settings.

I don't understand the cause of this difference. Is it a different instance of the Amplify class? If there is an error, please let me know.

I have confirmed the following.

• According to pnpm, the dependency of ui-storage seems to be up to react 18, but the result is the same with react 18.

• amplify ui is imported and executed on the client side.

• Authentication with Amplify is successful. So, in terms of the authentication flow, AWS.configure seems to be fine.

My environment is as follows:

• node22
• pnpm 10
• vite6
• react19
• react router7 (ssr: false)

What's the expected behaviour?

• Amplify.getConfig should not be empty.
• createAmplifyAuthAdapter should not have an error.

Help us reproduce the bug!

1. create vite

npx create-vite

• select react19 & react router v7

https://vite.dev/guide/#scaffolding-your-first-vite-project

1. amplify install

pnpm add @aws-amplify/ui-react-storage @aws-amplify/ui-react aws-amplify

1. add router config and page

2. start server

pnpm run dev

1. access storage ui

http://localhost:3000/s3-ui-test

Code Snippet

• package.json

{
  "name": "vite",
  "private": true,
  "type": "module",
  "scripts": {
    "build": "react-router build",
    "dev": "react-router dev",
    "start": "react-router-serve ./build/server/index.js",
    "typecheck": "react-router typegen && tsc"
  },
  "dependencies": {
    "@aws-amplify/ui-react": "^6.11.1",
    "@aws-amplify/ui-react-storage": "^3.10.2",
    "@react-router/node": "^7.5.3",
    "@react-router/serve": "^7.5.3",
    "aws-amplify": "^6.14.4",
    "isbot": "^5.1.27",
    "react": "^19.1.0",
    "react-dom": "^19.1.0",
    "react-router": "^7.5.3"
  },
  "devDependencies": {
    "@react-router/dev": "^7.5.3",
    "@tailwindcss/vite": "^4.1.4",
    "@types/node": "^22.15.3",
    "@types/react": "^19.1.2",
    "@types/react-dom": "^19.1.2",
    "react-router-devtools": "^1.1.10",
    "tailwindcss": "^4.1.4",
    "typescript": "^5.8.3",
    "vite": "^6.3.3",
    "vite-tsconfig-paths": "^5.1.4"
  }
}

• routes.ts

import { type RouteConfig, index, route } from "@react-router/dev/routes";

export default [
  index("routes/home.tsx"),
  route("s3-ui-test", "./routes/s3-ui-test.tsx"),
] satisfies RouteConfig;

• s3-ui-test.tsx

import {
  createAmplifyAuthAdapter,
  createStorageBrowser,
} from "@aws-amplify/ui-react-storage/browser";
import "@aws-amplify/ui-react-storage/styles.css";
import { Amplify } from "aws-amplify";
import outputs from "../../amplify_outputs.json";

Amplify.configure(outputs);
// debug config
console.log("Amplify config", Amplify.getConfig());

const { StorageBrowser } = createStorageBrowser({
  config: createAmplifyAuthAdapter(),
});

export default function S3UITest() {
  return (
    <main>
      <StorageBrowser />
    </main>
  );
}

Console log output

• createAmplifyAuthAdapter error log

Error: Amplify Storage configuration not found. Did you run Amplify.configure from your project root?

• Amplify.getConfig() in Storage Key（masked json）

{
  "aws_region": "ap-northeast-1",
  "bucket_name": "amplify-xxxxxxxxxxxxxxxxx",
  "buckets": [
    {
      "name": "<bucket_name>",
      "bucket_name": "amplify-xxxxxxxxxxxxxxxxx",
      "aws_region": "ap-northeast-1"
    }
  ]
}

Additional information and screenshots

• in createAmplifyAuthAdapter

• error
  

[ashika112]

Could you try moving your Amplify.configure to your app's entry point rather than withtin s3-ui-test.tsx. It is recommended in our docs to call Amplify.configure() as early in your app as possible to avoid race-condition [Reference docs]