AmplifyProvider generate a huge amount of warnings on import

0

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"
    ]
  }
}

gefragt vor 2 Jahren739 Aufrufe
2 Antworten
0

OK, I found out what is the problem. I must install typescript with CRA. Please consider issue solved.

beantwortet vor 2 Jahren
0

This is the step you might go through

To start a new Create React App project with TypeScript, you can run:

npx create-react-app my-app --template typescript

Then, you can follow this Amplify https://docs.amplify.aws/cli/function/build-options/.

AWS
beantwortet vor 9 Monaten

Du bist nicht angemeldet. Anmelden um eine Antwort zu veröffentlichen.

Eine gute Antwort beantwortet die Frage klar, gibt konstruktives Feedback und fördert die berufliche Weiterentwicklung des Fragenstellers.

Richtlinien für die Beantwortung von Fragen