无法解析模块“@aws-amplify/ui-react/styles.css”的路径

Question

我收到错误：

无法解析模块“@aws-amplify/ui-react/styles.css”的路径

我正在使用以下链接https://ui.docs.amplify.aws/components/authenticator#quick-start中显示的放大身份验证器组件

我的后端已经像往常一样配置好了，一切正常。

npx create-react-app exampleapp
npm start
amplify init
amplify add api
amplify push
npm install aws-amplify @aws-amplify/ui-react
amplify add auth
amplify pus

app.js配置如下

import { Amplify } from 'aws-amplify';

import { Authenticator } from '@aws-amplify/ui-react';
import '@aws-amplify/ui-react/styles.css';

import awsExports from './aws-exports';
Amplify.configure(awsExports);

export default function App() {
  return (
    <Authenticator>
      {({ signOut, user }) => (
        <main>
          <h1>Hello {user.username}</h1>
          <button onClick={signOut}>Sign out</button>
        </main>
      )}
    </Authenticator>
  );

一般来说，应用程序运行良好并且能够与放大后端连接。问题是它找不到css样式。似乎不在“@aws-amplify/ui-react”中。我的节点版本是 16.13.1。另外，我现在在 package.json 中使用包的最新版本

"@aws-amplify/ui-react": "^2.1.5",
"aws-amplify": "^4.3.10"

Answer 1

尝试将aws-amplify 升级到 4.3.11 或更高版本。此版本与使用 Webpack 5 的最新版 create-react-app 兼容。