Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Lots of warnings in Angular 9 CommonJS or AMD dependencies can cause optimization bailouts. #6202

Open
ErikHDev opened this issue Jun 30, 2020 · 54 comments
Assignees
Labels
Angular Related to Angular 2+ aws-sdk-js feature-request Request a new feature pending-v3 Issues pending upgrade of the AWS SDK UI Related to UI Components

Comments

@ErikHDev
Copy link

ErikHDev commented Jun 30, 2020

Describe the bug
Installing the latest version of @aws-amplify/ui-angular and aws-amplify causes many warnings in the console when adding authentication. Also unable to remove warnings using angular.json.

To Reproduce
Steps to reproduce the behavior:

  1. Install latest version of Angular CLI. (Tried on Angular 9 and Angular 10)
  2. Follow instructions from here https://docs.amplify.aws/start/getting-started/installation/q/integration/angular
  3. Add authentication
  4. Start app (ng s)

Expected behavior
NO warnings.

Code Snippet

For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

WARNING in /Users/ehanchett/programming/work/eig/front/crty-ng-ui/node_modules/@aws-sdk/client-s3/dist/es/runtimeConfig.browser.js depends on @aws-sdk/eventstream-serde-browser. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

WARNING in /Users/ehanchett/programming/work/eig/front/crty-ng-ui/node_modules/@aws-sdk/client-s3/dist/es/runtimeConfig.browser.js depends on @aws-sdk/hash-blob-browser. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

WARNING in /Users/ehanchett/programming/work/eig/front/crty-ng-ui/node_modules/@aws-sdk/client-s3/dist/es/commands/PutBucketTaggingCommand.js depends on @aws-sdk/middleware-apply-body-checksum. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

WARNING in /Users/ehanchett/programming/work/eig/front/crty-ng-ui/node_modules/@aws-sdk/client-s3/dist/es/commands/CreateBucketCommand.js depends on @aws-sdk/middleware-location-constraint. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

What is Configured?

//package.json
{
  "name": "angular-tour-of-heroes",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~10.0.0",
    "@angular/common": "~10.0.0",
    "@angular/compiler": "~10.0.0",
    "@angular/core": "~10.0.0",
    "@angular/forms": "~10.0.0",
    "@angular/platform-browser": "~10.0.0",
    "@angular/platform-browser-dynamic": "~10.0.0",
    "@angular/router": "~10.0.0",
    "@aws-amplify/ui-angular": "^0.2.9",
    "aws-amplify": "^3.0.18",
    "rxjs": "~6.5.5",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1000.0",
    "@angular/cli": "~10.0.0",
    "@angular/compiler-cli": "~10.0.0",
    "@types/node": "^12.11.1",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^6.0.0-next.1",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.0.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~3.3.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.9.5"
  }
}
import { Component, OnInit } from '@angular/core';
import { onAuthUIStateChange } from '@aws-amplify/ui-components';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit {
  title = 'angular-tour-of-heroes';
  constructor(){}
  ngOnInit(): void {
  onAuthUIStateChange((authState, authData) => {
       console.log(authState);
       console.log(authData);
     });
  }
}
@ErikHDev ErikHDev added the to-be-reproduced Used in order for Amplify to reproduce said issue label Jun 30, 2020
@Amplifiyer
Copy link
Contributor

These warnings seem to be red-herring and something angular introduced in version 10. See angular/angular-cli#18057 and angular/angular-cli#18058. We will follow these issues closely to see if there are any fixes we can add in the library to suppress them. For now it should be safe to use Amplify library even with the presence of these warnings.

@Amplifiyer Amplifiyer added Angular Related to Angular 2+ aws-sdk-js and removed to-be-reproduced Used in order for Amplify to reproduce said issue labels Jun 30, 2020
@rudyhadoux
Copy link

Hi, the problem is @AWS-SDK use in Amplify libraries. @AWS-SDK uses CommonJS.

It is recommended that you avoid depending on CommonJS modules in your Angular applications. Depending on CommonJS modules can prevent bundlers and minifiers from optimizing your application, which results in larger bundle sizes. Instead, it is recommended that you use ECMAScript modules in your entire application.

@gsans
Copy link

gsans commented Jul 13, 2020

Remove warnings adding this code

https://gist.github.com/gsans/8982c126c4fef668c094ff288f04241b

@rudyhadoux
Copy link

Thanks.

@ErikHDev
Copy link
Author

Thanks @gsans, yeah, that worked for me 2. I didn't realize at first I needed to add the values to the right of the depends, not the left.

Too bad AWS uses CommonJS. My bundle size is already huge :(

@rudyhadoux
Copy link

There are even more dependencies.

"options": {
"allowedCommonJsDependencies": [
"crypto-js",
"@aws-sdk/eventstream-marshaller",
"zen-push",
"uuid",
"lodash",
"ulid",
"buffer",
"js-cookie",
"@aws-crypto",
"zen-observable",
"@aws-sdk/util-utf8-node",
"@aws-crypto/sha256-js",
"@aws-sdk/util-buffer-from",
"@aws-sdk/smithy-client",
"@aws-sdk/middleware-serde",
"@aws-sdk/middleware-user-agent",
"@aws-sdk/middleware-retry",
"@aws-sdk/middleware-signing",
"@aws-sdk/middleware-content-length",
"@aws-sdk/middleware-host-header",
"@aws-sdk/config-resolver",
"@aws-sdk/s3-request-presigner",
"@aws-sdk/util-format-url",
"@aws-sdk/util-create-request",
"@aws-sdk/property-provider",
"axios",
"@aws-sdk/fetch-http-handler",
"@aws-sdk/protocol-http",
"@aws-sdk/querystring-builder",
"@aws-sdk/util-utf8-browser",
"@aws-sdk/url-parser-browser",
"@aws-crypto/sha256-browser",
"@aws-sdk/url-parser-node",
"@aws-sdk/util-uri-escape",
"@aws-sdk/middleware-sdk-s3",
"@aws-sdk/middleware-bucket-endpoint",
"@aws-sdk/querystring-parser",
"@aws-sdk/middleware-apply-body-checksum",
"@aws-sdk/middleware-ssec",
"@aws-sdk/middleware-expect-continue",
"fast-xml-parser",
"@aws-sdk/xml-builder",
"@aws-sdk/md5-js",
"@aws-sdk/hash-blob-browser",
"@aws-sdk/eventstream-serde-browser",
"@aws-sdk/middleware-location-constraint"
],

@eelayoubi
Copy link

eelayoubi commented Jul 21, 2020

I added all necessary libraries to the allowedCommonJsDependencies, but I am still getting the following error:

Uncaught ReferenceError: exports is not defined
at Module../node_modules/@aws-sdk/middleware-serde/build/deserializerMiddleware.js (vendor.js:129105)
at webpack_require (bootstrap:79)
at Object../node_modules/@aws-sdk/middleware-serde/build/index.js (index.ts:1)
at webpack_require (bootstrap:79)
at Module../node_modules/@aws-sdk/client-cognito-identity/dist/es/commands/CreateIdentityPoolCommand.js (CognitoIdentityClient.ts:302)
at webpack_require (bootstrap:79)
at Module../node_modules/@aws-sdk/client-cognito-identity/dist/es/CognitoIdentity.js (vendor.js:118553)
at webpack_require (bootstrap:79)
at Module../node_modules/@aws-sdk/client-cognito-identity/dist/es/index.js (index.ts:1)
at webpack_require (bootstrap:79)

And here is what I added in the angular.json:

"allowedCommonJsDependencies": [
"zen-push",
"lodash",
"ulid",
"@AWS-SDK",
"@aws-amplify/pubsub",
"@aws-sdk/client-cognito-identity",
"uuid",
"crypto-js",
"@aws-sdk/eventstream-marshaller",
"buffer",
"js-cookie",
"@aws-crypto",
"zen-observable",
"@aws-sdk/util-utf8-node",
"@aws-crypto/sha256-js",
"@aws-sdk/util-buffer-from",
"@aws-sdk/smithy-client",
"@aws-sdk/middleware-serde",
"@aws-sdk/middleware-user-agent",
"@aws-sdk/middleware-retry",
"@aws-sdk/middleware-signing",
"@aws-sdk/middleware-content-length",
"@aws-sdk/middleware-host-header",
"@aws-sdk/config-resolver",
"@aws-sdk/s3-request-presigner",
"@aws-sdk/util-format-url",
"@aws-sdk/util-create-request",
"@aws-sdk/property-provider",
"axios",
"@aws-sdk/fetch-http-handler",
"@aws-sdk/protocol-http",
"@aws-sdk/querystring-builder",
"@aws-sdk/util-utf8-browser",
"@aws-sdk/url-parser-browser",
"@aws-crypto/sha256-browser",
"@aws-sdk/url-parser-node",
"@aws-sdk/util-uri-escape",
"@aws-sdk/middleware-sdk-s3",
"@aws-sdk/middleware-bucket-endpoint",
"@aws-sdk/querystring-parser",
"@aws-sdk/middleware-apply-body-checksum",
"@aws-sdk/middleware-ssec",
"@aws-sdk/middleware-expect-continue",
"fast-xml-parser",
"@aws-sdk/xml-builder",
"@aws-sdk/md5-js",
"@aws-sdk/hash-blob-browser",
"@aws-sdk/eventstream-serde-browser",
"@aws-sdk/middleware-location-constraint"
],

any idea on what I am missing?

@rudyhadoux
Copy link

You just have to add missing libraries, like I mentioned.

@eelayoubi
Copy link

I have already done that

@rudyhadoux
Copy link

So, it is strange...

@eelayoubi
Copy link

if you check what is complaining about, it is already in the allowedCommonJsDependencies ... So I don't get it ...

@gsans
Copy link

gsans commented Jul 21, 2020

@eelayoubi that seems a different issue. The fix that appears in this thread is to remove the warnings. Your trace is not from a warning but an error.

@eelayoubi
Copy link

@gsans you are correct, although the warnings while building the project disappeared, this error stayed in the console. I thought it might be related. I will check again.

@ErikHDev
Copy link
Author

@eelayoubi IIRC correctly that occurs when you're in Angular 9/10 and you are using the older @aws-amplify library for angular.

Make sure to use "@aws-amplify/ui-angular",

and

aws-amplify

@eelayoubi
Copy link

eelayoubi commented Jul 21, 2020

@ErikHDev as per the tutorial we are installing the latest versions of '@aws-amplify/ui-angular' & 'aws-amplify' (I verified the package.json too).
https://docs.amplify.aws/start/getting-started/setup/q/integration/angular#install-amplify-libraries

and yes, I am using angular 10.

@Jun711
Copy link

Jun711 commented Aug 5, 2020

This is one of the reasons why amplify-js is pretty large in size.

@stale
Copy link

stale bot commented Sep 5, 2020

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@hisham
Copy link

hisham commented Sep 6, 2020

Definitely still needed.

@PauloDerney
Copy link

@Amplifiyer , some feedback on this problem, i understand that you make use of the CommonJs modules that affect the size of the angular packages, you are plan to release a version using ES modules?

@rob3c
Copy link

rob3c commented Sep 9, 2020

Hiding the warnings is not a fix - it just masks the problem and probably makes it less likely to be fixed properly.

Which issue can we follow where the use of legacy commonjs modules is being tracked and migration progress can be followed?

@dcchristopher
Copy link

As nice as it would be to have an ECMAScript aws-sdk for our Angular apps, it's not a show-stopper. The warnings went away for most of us after updating angular.json to ignore certain Common JS dependencies.

For people looking to shed some aws-sdk weight, consider only importing what you need (which has been available in aws-sdk for the last couple of years):

import Amplify from '@aws-amplify/auth'; // (assuming you only need Cognito)
import aws_exports from "./aws-exports";
Amplify.configure(aws_exports);

The above sheds almost 10MB in my case (from 13.9MB to 4.27MB, vendor.js).

@gsans
Copy link

gsans commented Sep 21, 2020

Issue leaking to other frameworks like Vue. Not only Angular as this results in larger bundle sizes:

https://twitter.com/taseroth/status/1307429119387463680?s=19

@Tyler-V
Copy link

Tyler-V commented Sep 24, 2020

Yikes! Lets get a resolution on this, padding allowedCommonJsDependencies is most certainly only a bandaid for the console.

@hisham
Copy link

hisham commented Feb 23, 2021

I can confirm the warnings are gone in my app as well after upgrading. However bundle size remained the same, in fact went up by 100kb or so after updating to the latest @aws-amplify npm packages.

@ericclemmons
Copy link
Contributor

I did some research into this using Angular CLI 11 (thanks for the tip!):

#7839 (comment)

#7842 fixed some crypto errors I was getting in the build, but the warnings still persist.

The new bundle-sizes seem reasonable though for Amplify + Auth, though?

$ ng build --prod
✔ Browser application bundle generation complete.
✔ Copying assets complete.
✔ Index html generation complete.

Initial Chunk Files               | Names         |      Size
main.9e5ef2589a32d22a3791.js      | main          | 134.96 kB
polyfills.9d7f1bb7deba7d27ca41.js | polyfills     |  36.04 kB
runtime.7425f237727658da0a30.js   | runtime       |   1.45 kB
styles.3ff695c00d717f2d2a11.css   | styles        |   0 bytes

@ericclemmons ericclemmons added this to the Bundle Size Optimizations milestone Mar 3, 2021
@ericclemmons
Copy link
Contributor

The fix I'd like to see for this issue is investigating why Angular is giving this warning when we have es files explicitly being output 🤔

@Donovantxy
Copy link

Donovantxy commented Mar 4, 2021

I still have this issue after updating from 9 to 12, it's is warning me about a service

@ericclemmons
Copy link
Contributor

@Donovantxy I'm not sure what you mean, can you share code or screenshots or console output?

@Donovantxy
Copy link

Donovantxy commented Mar 5, 2021

@Donovantxy I'm not sure what you mean, can you share code or screenshots or console output?

These are the warnings I'm getting from building the project with Angular 11.2.4

Warning: /src/app/services/session.service.ts depends on 'rxjs/internal/observable/interval'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/redux/user/user.state.ts depends on 'rxjs/internal/Observable'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/common/pages/project/project.module.ts depends on 'expose-loader?Phaser!phaser/build/phaser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/common/pages/project/project.module.ts depends on 'expose-loader?p2!phaser/build/p2'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/common/pages/project/project.module.ts depends on 'expose-loader?PIXI!phaser/build/pixi'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/pages/signup/signup.component.ts depends on 'rxjs/internal/observable/throwError'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/common/components/fine-registration-result/fine-registration-result.component.ts depends on 'rxjs/internal/operators'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/pages/company-admin/modals/add-storage-modal/storage-modal.component.ts depends on '@vercator/pages/company-admin/company-storage-list/dropbox/dropbox-service'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/common/pages/project/project-survey-coordinates/bubble-view.component.ts depends on 'babylonjs-gui'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /src/app/shared/file-explorer/explorer-actions/modals/storage-files-upload-modal/s3-supplier.service.ts depends on 'aws-sdk'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

@stale
Copy link

stale bot commented Jun 26, 2021

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@zakhenry
Copy link

zakhenry commented Jun 27, 2021

bump

@hanna-becker
Copy link

This is my current list of warnings after clearing the npm cache and deleting node_modules (Angular CLI v12.2.7):

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/analytics/lib-esm/Providers/AWSPinpointProvider.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/analytics/lib-esm/Providers/AmazonPersonalizeProvider.js depends on 'lodash/get'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/analytics/lib-esm/Providers/AmazonPersonalizeProvider.js depends on 'lodash/isEmpty'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/analytics/lib-esm/Providers/AmazonPersonalizeProvider.js depends on 'lodash/isEqual'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/core/lib-esm/Signer.js depends on '@aws-crypto/sha256-js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/datastore/lib-esm/util.js depends on 'buffer'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/datastore/lib-esm/util.js depends on 'ulid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/datastore/lib-esm/util.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/geo/lib-esm/Providers/AmazonLocationServiceProvider.js depends on 'camelcase-keys'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-sdk/client-cognito-identity/dist/es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-sdk/client-s3/dist/es/protocols/Aws_restXml.js depends on 'fast-xml-parser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-sdk/eventstream-marshaller/dist/es/EventStreamMarshaller.js depends on '@aws-crypto/crc32'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'buffer'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/core'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/hmac-sha256'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/lib-typedarrays'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/amazon-cognito-identity-js/es/Client.js depends on 'isomorphic-unfetch'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/datastore/lib-esm/datastore/datastore.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /home/hanna/workspace/cosonify/node_modules/@aws-amplify/pubsub/lib-esm/Providers/AWSAppSyncRealTimeProvider.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

When upgrading my Amplify CLI, this deprecation warning caught my eye:

npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. [...]

Just a wild guess, but maybe @aws-amplify and othter aws npm packages use a similarly old version of uuid and other dependencies, which do not have es6 module support, yet. May be a low hanging fruit upgrading those dependencies.

@sibijohn72
Copy link

bump for the new year!

@curtisblanchette
Copy link

curtisblanchette commented May 3, 2022

bump

angular cli 13.2.5
Only includingamazon-gocnito-identity-js from amplify

/...node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'buffer'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/core'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/hmac-sha256'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/lib-typedarrays'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'crypto-js/sha256'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/Client.js depends on 'isomorphic-unfetch'. CommonJS or AMD dependencies can cause optimization bailouts.

/.../node_modules/amazon-cognito-identity-js/es/CognitoUser.js depends on 'crypto-js/enc-base64'. CommonJS or AMD dependencies can cause optimization bailouts.

@abdallahshaban557 abdallahshaban557 added the UI Related to UI Components label Jun 3, 2022
@stocaaro
Copy link
Member

stocaaro commented Dec 8, 2022

Related to #10010

@AllanZhengYP AllanZhengYP added the pending-v3 Issues pending upgrade of the AWS SDK label Dec 13, 2022
@AllanZhengYP
Copy link
Member

I can confirm most of the warning has gone away with the latest AWS SDK version. The only things left are from the @aws-crypto packages. Add the pending-v3 label to keep track of the AWS SDK upgrade work

Warning: /Users/zheallan/workspace/tmp/MyAngularApp/node_modules/@aws-sdk/client-s3/dist-es/protocols/Aws_restXml.js depends on 'fast-xml-parser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/zheallan/workspace/tmp/MyAngularApp/node_modules/@aws-sdk/client-s3/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha1-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/zheallan/workspace/tmp/MyAngularApp/node_modules/@aws-sdk/client-s3/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/zheallan/workspace/tmp/MyAngularApp/node_modules/@aws-sdk/middleware-flexible-checksums/dist-es/selectChecksumAlgorithmFunction.js depends on '@aws-crypto/crc32'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/zheallan/workspace/tmp/MyAngularApp/node_modules/@aws-sdk/middleware-flexible-checksums/dist-es/selectChecksumAlgorithmFunction.js depends on '@aws-crypto/crc32c'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

@tannerabread tannerabread added the feature-request Request a new feature label Mar 6, 2023
@prudnikov
Copy link

prudnikov commented Mar 26, 2023

I just started a new project, added AmplifyAuthenticatorModule only, and see lots of warnings

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/analytics/lib-esm/Providers/AWSPinpointProvider.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/analytics/lib-esm/Providers/AmazonPersonalizeProvider.js depends on 'lodash/isEmpty'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/analytics/lib-esm/Providers/AmazonPersonalizeProvider.js depends on 'lodash/isEqual'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/core/lib-esm/Signer.js depends on '@aws-crypto/sha256-js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/core/lib-esm/Signer.js depends on 'url'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/datastore/lib-esm/datastore/datastore.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/datastore/lib-esm/util.js depends on 'ulid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/geo/lib-esm/Providers/AmazonLocationServiceProvider.js depends on 'camelcase-keys'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/notifications/lib-esm/InAppMessaging/InAppMessaging.js depends on 'lodash/flatten'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/notifications/lib-esm/InAppMessaging/Providers/AWSPinpointProvider/index.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/notifications/lib-esm/InAppMessaging/SessionTracker/SessionTracker.js depends on 'lodash/noop'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/notifications/node_modules/@aws-sdk/client-pinpoint/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/pubsub/lib-esm/Providers/AWSAppSyncRealTimeProvider/index.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/storage/lib-esm/providers/AWSS3Provider.js depends on 'events'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui-angular/fesm2015/aws-amplify-ui-angular.js depends on 'classnames'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui-angular/fesm2015/aws-amplify-ui-angular.js depends on 'qrcode'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/helpers/authenticator/utils.mjs depends on 'xstate/lib/waitFor.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/machines/authenticator/actors/signIn.mjs depends on 'lodash/get.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/machines/authenticator/signUp.mjs depends on 'lodash/pickBy.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/theme/createTheme.mjs depends on 'style-dictionary/lib/utils/deepExtend.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/theme/createTheme.mjs depends on 'style-dictionary/lib/utils/flattenProperties.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/theme/utils.mjs depends on 'lodash/kebabCase.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-amplify/ui/dist/esm/theme/utils.mjs depends on 'style-dictionary/lib/utils/references/usesReference.js'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-cognito-identity/dist/es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-comprehend/dist/es/protocols/Aws_json1_1.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-lex-runtime-service/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-lex-runtime-v2/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-location/dist-es/runtimeConfig.browser.js depends on '@aws-crypto/sha256-browser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-s3/dist/es/protocols/Aws_restXml.js depends on 'fast-xml-parser'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/client-translate/dist/es/protocols/Aws_json1_1.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/eventstream-codec/dist-es/EventStreamCodec.js depends on '@aws-crypto/crc32'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/eventstream-marshaller/dist/es/EventStreamMarshaller.js depends on '@aws-crypto/crc32'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/@aws-sdk/middleware-retry/dist/es/defaultStrategy.js depends on 'uuid'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/amazon-cognito-identity-js/es/AuthenticationHelper.js depends on 'buffer'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/amazon-cognito-identity-js/es/Client.js depends on 'isomorphic-unfetch'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/amazon-cognito-identity-js/es/CookieStorage.js depends on 'js-cookie'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

Warning: /Users/****/Code/****/****-app/node_modules/universal-cookie/es6/Cookies.js depends on 'cookie'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

"@angular/core": "^15.2.0",
"@aws-amplify/ui-angular": "^3.2.11",
"aws-amplify": "^5.0.22",

@elin-y
Copy link

elin-y commented Mar 29, 2023

Almost 3 years and still the same problem! 😞 👎

@abdallahshaban557
Copy link
Contributor

We are working on resolving these errors. It requires a substantial amount of refactoring on our end, and we are defining now exactly how to go about it. We will provide an update on this issue when we have next steps identified.

@abdallahshaban557
Copy link
Contributor

Hello everyone! As part of our next major version, we now have a prototype working while removing most of the errors, except the sha256 package error. We are attempting to find a solution for it now. We just wanted to let you know this is still on our radar!

@iakovoszournatzis
Copy link

Any updates on this?

@cwomack cwomack self-assigned this Sep 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Angular Related to Angular 2+ aws-sdk-js feature-request Request a new feature pending-v3 Issues pending upgrade of the AWS SDK UI Related to UI Components
Projects
None yet
Development

No branches or pull requests