Package path ./dist/styles.css is not exported from package

Before creating a new issue, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have tried disabling all browser extensions or using a different browser
• I have tried deleting the node_modules folder and reinstalling my dependencies
• I have read the guide for submitting bug reports.

On which framework/platform are you having an issue?

Angular

Which UI component?

Authenticator

How is your app built?

pretty default angular 15 setup

What browsers are you seeing the problem on?

Chrome

Please describe your bug.

I have migrated my working angular 14 app to angular 15. I don’t exactly know what causes the problem but it has never happened before the upgrade but is happening now - it might, however, also be related to the recent changes in this library.

When I try to build the application I get the following errors:

./node_modules/@angular-devkit/build-angular/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[1]!./node_modules/@angular-devkit/build-angular/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[6].rules[0].oneOf[0].use[2]!./node_modules/@aws-amplify/ui-angular/theme.css - Error: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/css-loader/dist/cjs.js):
Error: Package path ./dist/styles.css is not exported from package ###/node_modules/@aws-amplify/ui-angular/node_modules/@aws-amplify/ui (see exports field in ###/node_modules/@aws-amplify/ui-angular/node_modules/@aws-amplify/ui/package.json)

./src/styles.scss?ngGlobalStyle - Error: Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
HookWebpackError: Module build failed (from ./node_modules/@angular-devkit/build-angular/node_modules/css-loader/dist/cjs.js):
Error: Package path ./dist/styles.css is not exported from package ###/node_modules/@aws-amplify/ui-angular/node_modules/@aws-amplify/ui (see exports field in ###/node_modules/@aws-amplify/ui-angular/node_modules/@aws-amplify/ui/package.json)

I assume that the export statement in packages/ui/package.json line 12 is the mistake, because the name is “./styles.css” instead of “./dist/styles.css”. I’m not sure if the export without dist is required, so my proposed solution is adding the line ".dist/styles.css": "./dist/styles.css", which for me fixes the problem. I will create a PR with this change.

What’s the expected behaviour?

Should build.

Help us reproduce the bug!

I think it should be enough to simply use Amplify UI in the newly released angular 15.

Code Snippet

No response

Additional information and screenshots

No response

[SilverLinings89]

The proposed changes is included in the pr 3001: https://github.com/aws-amplify/amplify-ui/pull/3001

[wlee221]

Quick update, we merged your PR, and this patch will be released next Tuesday. Thanks for your patience! We’ll close this issue after release.