Modularlization doesnt work with aws-amplify-react?

** Which Category is your question related to? **

aws-amplify-react

** What AWS Services are you utilizing? **

auth

** Provide additional details e.g. code snippets **

I am guessing I am missing something but I do not want to include the libs for every single package. I only need auth and nothing else - but importing aws-amplify-react requires @aws-amplify/xr which I am not using and never will.

How do I stop this? Docs seem to indicate I need to custom create aws-amplify-react myself and make it work differently? Why is that not just done by you guys?

As it stands this package makes our bundle 10x larger with a bunch of junk.

The second I include things I get

Module not found: Error: Can't resolve '@aws-amplify/xr' in 'node_modules/aws-amplify-react/dist/XR'
 @ ./node_modules/aws-amplify-react/dist/XR/SumerianScene.js 61:11-37
 @ ./node_modules/aws-amplify-react/dist/XR/index.js
 @ ./node_modules/aws-amplify-react/dist/index.js

Just to be clear I’ve read this 100 times and it doesn’t even make sense to me:

https://github.com/aws-amplify/amplify-js/wiki/Amplify-modularization#apply-modularized-amplify-to-other-packages

says to export then doesnt export or show how things are used anyway - seems to indicate we need to modify the module itself to do those things…

When the @aws-amplify/auth is not imported, Auth would be null or undefined

Check if the module is imported before using any method from the module:
// in aws-amplify-react/src/Auth/SignIn.jsx
    signIn() {

You are literally providing instructions on how to fix your own package here? what gives?

[paalex]

As @powerful23 mentioned, if you would like to use modularization with aws-amplify-react in the current state you will need to import the React component from dist like so:

import Auth from "@aws-amplify/auth";
import { Authenticator } from 'aws-amplify-react/dist/Auth'

@kalzoo @oottinger, could you try this solution?

In the meantime we are in the process of refactoring our codebase to improve modularization and the UI components as well. I will add this issue to those milestones to investigate.

@jordanranz I tried on "aws-amplify-react": "^3.1.5" and 2.6.3 as well and there’s no Auth in the dist folder of the project. Following #4279, Importing from lib folder leads to the following error Can't resolve '@aws-amplify/ui'. Any ideas? Thanks

[jordanranz]

As @powerful23 mentioned, if you would like to use modularization with aws-amplify-react in the current state you will need to import the React component from dist like so:

import Auth from "@aws-amplify/auth";
import { Authenticator } from 'aws-amplify-react/dist/Auth'

@kalzoo @oottinger, could you try this solution?

In the meantime we are in the process of refactoring our codebase to improve modularization and the UI components as well. I will add this issue to those milestones to investigate.