I am getting a huge amount of warnings when I import AmplifyProvider.
WARNING in ./node_modules/@aws-amplify/ui/dist/esm/types/authenticator/user.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'D:\reactjs\amplify-work\node_modules\@aws-amplify\src\types\authenticator\user.ts' file: Error: ENOENT: no such file or directory, open 'D:\reactjs\amplify-work\node_modules\@aws-amplify\src\types\authenticator\user.ts'
@ ./node_modules/@aws-amplify/ui/dist/esm/index.js 14:0-95 14:0-95 14:0-95
@ ./node_modules/@aws-amplify/ui-react/dist/esm/index.js 8:0-74 8:0-74 8:0-74 8:0-74
@ ./src/index.js 10:0-56
WARNING in ./node_modules/@aws-amplify/ui/dist/esm/validators/index.js
Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):
Failed to parse source map from 'D:\reactjs\amplify-work\node_modules\@aws-amplify\src\validators\index.ts' file: Error: ENOENT: no such file or directory, open 'D:\reactjs\amplify-work\node_modules\@aws-amplify\src\validators\index.ts'
@ ./node_modules/@aws-amplify/ui/dist/esm/machines/authenticator/actors/signIn.js 8:0-66 528:23-24
@ ./node_modules/@aws-amplify/ui/dist/esm/machines/authenticator/index.js 4:0-54 275:18-19
@ ./node_modules/@aws-amplify/ui/dist/esm/index.js 12:0-79 12:0-79
@ ./node_modules/@aws-amplify/ui-react/dist/esm/index.js 8:0-74 8:0-74 8:0-74 8:0-74
@ ./src/index.js 10:0-56
WARNING in src\index.js
Line 5:8: 'Amplify' is defined but never used no-unused-vars
Line 7:10: 'AmplifyProvider' is defined but never used no-unused-vars
1548 warnings have detailed information that is not shown.
Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.
webpack 5.71.0 compiled with 1549 warnings in 513 ms
===============================================
Create standard: create-react-app
Import: npm i @aws-amplify/ui-react aws-amplify
File index.js
import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import Amplify from "aws-amplify";
import "@aws-amplify/ui-react/styles.css";
import { AmplifyProvider } from "@aws-amplify/ui-react";
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById("root")
);
File App.js
import "./App.css";
function App() {
return (
<div className="App">
<header className="App-header">
<h1>Hello world</h1>
</header>
</div>
);
}
export default App;
package.json
{
"name": "amplify-work",
"version": "0.1.0",
"private": true,
"dependencies": {
"@aws-amplify/ui-react": "^2.13.0",
"@testing-library/jest-dom": "^5.16.3",
"@testing-library/react": "^12.1.4",
"@testing-library/user-event": "^13.5.0",
"aws-amplify": "^4.3.18",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-scripts": "5.0.0",
"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"
]
}
}