Felix Gerber
Felix Gerber

Reputation: 1651

Angular - primeng CommonJS or AMD dependencies can cause optimization bailouts

I got a little Angular app, in which I'm using PrimeNG components. Since I did the Angular 10 update I get the following Warning:

CommonJS or AMD dependencies can cause optimization bailouts.

for different PirmeNg-components.

I already tried this:

"allowedCommonJsDependencies": [
              "loadsh",
              "primeng/primeng",
              "primeicons",

This is suggested on the offical homepage

Another try I did is checking the imports like mentioned in this post

import { x } from '@auth/auth....'           // Warning
...to...
import { x } from '../auth/...'              // Warning goes away

But as I don't have any imports with "@" on the beginning I'm wondering how this warning could be fixed or suppressed?

EDIT:

Error in detail:

WARNING in 'path' depends on 'chartjs'. CommonJS or AMD dependencies can cause optimization bailouts.

Upvotes: 4

Views: 10042

Answers (2)

Gunjan Khanwilkar
Gunjan Khanwilkar

Reputation: 2495

you just need to add -

    "allowedCommonJsDependencies": [ 
    "loadsh", 
    "primeng/primeng", 
    "primeicons", 
    "chartjs", 
    ---etc--- all the CommonJs dependency goes here to suppress warning!    
] 

Just Add

chartjs

in your existing list like above and you are good. For detailed explanation please check this answer here - https://stackoverflow.com/a/63430362/6097025

Note that this is just a workaround to suppress warnings! If you want to completely fix this then you need to import ES-6 modules for your dependencies and avoid CommonJs dependencies. Angular-10 onwards now it shows these warnings for build optimization.

Upvotes: 4

akhilreddy
akhilreddy

Reputation: 312

In angular.json add

 "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "allowedCommonJsDependencies": ["chart.js"],

Upvotes: 11

Related Questions