aws-amplify / amplify-js

A declarative JavaScript library for application development using cloud services.
https://docs.amplify.aws/lib/q/platform/js
Apache License 2.0
9.42k stars 2.12k forks source link

export 'default' (imported as 'Amplify') was not found in 'aws-amplify' #10827

Closed guychevelle closed 1 year ago

guychevelle commented 1 year ago

Before opening, please confirm:

JavaScript Framework

React

Amplify APIs

DataStore

Amplify Categories

No response

Environment information

``` # Put output below this line System: OS: macOS 11.7 CPU: (4) x64 Intel(R) Core(TM) i7-4650U CPU @ 1.70GHz Memory: 159.15 MB / 8.00 GB Shell: 3.2.57 - /bin/bash Binaries: Node: 16.14.2 - /usr/local/bin/node npm: 8.6.0 - /usr/local/bin/npm Browsers: Chrome: 108.0.5359.124 Safari: 16.0 npmPackages: @aws-amplify/ui-react: ^4.3.1 => 4.3.1 @aws-amplify/ui-react-internal: undefined () @testing-library/jest-dom: ^5.16.5 => 5.16.5 @testing-library/react: ^13.4.0 => 13.4.0 @testing-library/user-event: ^13.5.0 => 13.5.0 aws-amplify: ^5.0.8 => 5.0.8 react: ^18.2.0 => 18.2.0 (18.1.0) react-dom: ^18.2.0 => 18.2.0 react-icons: ^4.7.1 => 4.7.1 react-router-dom: ^6.6.1 => 6.6.1 react-scripts: 5.0.1 => 5.0.1 web-vitals: ^2.1.4 => 2.1.4 npmGlobalPackages: @aws-amplify/cli: 9.2.1 corepack: 0.10.0 npm: 8.6.0

Describe the bug

Attempting to configure for multi auth (cognito and IAM) in index.js. This same code works with no issue for an application using aws-amplify 4.3.36.

Expected behavior

No errors when running npm start

Reproduction steps

index.js copied from an existing application that runs with no errors.

Code Snippet

// Put your code below this line.
import { DataStore, AuthModeStrategyType } from 'aws-amplify';
import Amplify from 'aws-amplify';
import config from './aws-exports';

//  additional DataStore configuration to avoid subscription errors
//  when using multiple auth modes (cognito + IAM). aws-amplify bug
//  reference:  https://github.com/aws-amplify/amplify-js/issues/9369
Amplify.configure({
   ...config,
   DataStore: {
     authModeStrategyType: AuthModeStrategyType.MULTI_AUTH
   }
  });

### Log output

<details>

// Put your logs below this line Compiled with problems:

ERROR in ./src/index.js 22:0-17

export 'default' (imported as 'Amplify') was not found in 'aws-amplify' (possible exports: API, APIClass, AWSCloudWatchProvider, AWSKinesisFirehoseProvider, AWSKinesisProvider, AWSPinpointProvider, AmazonPersonalizeProvider, Amplify, Analytics, Auth, AuthModeStrategyType, Cache, ClientDevice, DataStore, Geo, Hub, I18n, Interactions, Logger, Notifications, Predicates, Predictions, PubSub, ServiceWorker, Signer, SortDirection, Storage, StorageClass, XR, graphqlOperation, syncExpression, withSSRContext)



</details>

### aws-exports.js

_No response_

### Manual configuration

_No response_

### Additional configuration

_No response_

### Mobile Device

_No response_

### Mobile Operating System

_No response_

### Mobile Browser

_No response_

### Mobile Browser Version

_No response_

### Additional information and screenshots

My assumption is that something has changed between aws-amplify versions 4.3.36 and 5.0.8.  Is there now a different method/configuration for apps that intend to use multiple auth methods?
guychevelle commented 1 year ago

Get the same error when simply using the below:

Amplify.configure(config)

nadetastic commented 1 year ago

Hi @guychevelle

Amplify as a default export is deprecated and you would need to import it as a named export

import { Amplify } from 'aws-amplify'

Could you try this?

guychevelle commented 1 year ago

awesome! that works.

cbou commented 1 year ago

This tutorial should be updated: https://aws.amazon.com/blogs/mobile/use-existing-cognito-resources-for-your-amplify-api-storage-and-more/

akbarm commented 1 year ago

I'm still getting this error applying :

import { Amplify } from 'aws-amplify'

ERROR in ./src/index.js 12:0-14 export 'default' (imported as 'Amplify') was not found in 'aws-amplify'

Full code

import logo from './logo.svg'; import './App.css';

import { Amplify } from 'aws-amplify' import { withAuthenticator, signOut } from '@aws-amplify/ui-react'

function App({ signOut }) { return (

logo

Edit src/App.js and save to reload.

Learn React

); }

export default withAuthenticator(App);

akbarm commented 1 year ago

import Amplify from 'aws-amplify'; import awsconfig from './aws-exports'; import { AmplifySignOut, withAuthenticator } from '@aws-amplify/ui-react';

Amplify.configure(awsconfig);

import logo from './logo.svg'; import './App.css';

import { Amplify } from 'aws-amplify' import { withAuthenticator, signOut } from '@aws-amplify/ui-react'

function App({ signOut }) { return (

); }

export default withAuthenticator(App);

nadetastic commented 1 year ago

Hi @akbarm, could you open a new issue for this and also share your package.json?

Open new issue - https://github.com/aws-amplify/amplify-js/issues/new/choose

yashwanth78-bobby commented 5 months ago

export 'API' (imported as 'API') was not found in 'aws-amplify' (possible exports: Amplify)

what about this issue??