amplify-js: [aws-amplify/amplify-js] export 'default' (imported as 'Amplify') was not found in 'aws-amplify'
Before opening, please confirm:
- I have searched for duplicate or closed issues and discussions.
- I have read the guide for submitting bug reports.
- I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.
JavaScript Framework
React
Amplify APIs
REST API
Amplify Categories
auth
Environment information
System:
OS: Windows 10 10.0.19045
CPU: (4) x64 Intel(R) Core(TM) i5-6200U CPU @ 2.30GHz
Memory: 1.33 GB / 7.88 GB
Binaries:
Node: 18.15.0 - C:\Program Files\nodejs\node.EXE
Yarn: 1.22.19 - ~\AppData\Roaming\npm\yarn.CMD
npm: 9.5.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Spartan (44.19041.1266.0), Chromium (111.0.1661.44)
Internet Explorer: 11.0.19041.1566
npmPackages:
@aws-amplify/ui-react: ^4.4.0 => 4.4.0
@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.20 => 5.0.20
react: ^18.2.0 => 18.2.0
react-dom: ^18.2.0 => 18.2.0
react-scripts: 5.0.1 => 5.0.1
web-vitals: ^2.1.4 => 2.1.4
npmGlobalPackages:
@aws-amplify/cli: 11.0.2
yarn: 1.22.19
Describe the bug
Running this on a Windows 10 environment.
Following this tutorial – > https://www.youtube.com/watch?v=Sk9HMuAaTmQ
Failed to compile.
Attempted import error: 'aws-amplify' does not contain a default export (imported as 'Amplify').
ERROR in ./src/index.js 12:0-14
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, graphqlOperation, syncExpression, withSSRContext)
Expected behavior
Expecting the Login Page to be rendered as per the tutorial I have followed.
Reproduction steps
When i run the command “npm start” from the command line.
Code Snippet
// Put your code below this line.
**App.js**
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 (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
<signOut />
</div>
);
}
export default withAuthenticator(App);
Additional configuration
package.json
{
"name": "react-cognito-api",
"version": "0.1.0",
"private": true,
"dependencies": {
"@aws-amplify/ui-react": "^4.4.0",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"aws-amplify": "^5.0.20",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Mobile Device
No response
Mobile Operating System
No response
Mobile Browser
No response
Mobile Browser Version
No response
Additional information and screenshots
No response
About this issue
- Original URL
- State: closed
- Created a year ago
- Comments: 15 (9 by maintainers)
@nadetastic @helgabalashova . Worked like a charm. Thank you both for the support.
@akbarm I noticed in your code that you call
Amplify.config(config)instead ofAmplify.configure(config). Can you please fix it and let us know if it fixes the problem you have.