Production Build Getting Failed

[im-ashar]

Please provide the environment you discovered this bug in.

I am trying to publish my app on netlify and the build is getting failed although on local it is working fine.

Which area/package is the issue in?

Don't know / other

Description

I created a simple angular app using spartan ui. It is working fine but when i tried to publish it on netlify (and vercel also) i am getting the error mentioned in the logs.

Please provide the exception or error you saw

Here are the logs:

12:06:39 PM: $ npm run build
12:06:39 PM: > split-wiser@0.0.0 build
12:06:39 PM: > ng build
12:06:39 PM: ❯ Building...
12:06:45 PM: ✔ Building...
12:06:45 PM: Application bundle generation failed. [5.636 seconds]
12:06:45 PM: ▲ [WARNING] TS-998113: HlmSpinnerComponent is not used within the template of HomeComponent [plugin angular-compiler]
12:06:45 PM:     src/app/components/home/home.component.ts:36:4:
12:06:45 PM:       36 │     HlmSpinnerComponent,
12:06:45 PM:          ╵     ~~~~~~~~~~~~~~~~~~~
12:06:45 PM: ▲ [WARNING] TS-998113: HlmAvatarComponent is not used within the template of HomeComponent [plugin angular-compiler]
12:06:45 PM:     src/app/components/home/home.component.ts:44:4:
12:06:45 PM:       44 │     HlmAvatarComponent,
12:06:45 PM:          ╵     ~~~~~~~~~~~~~~~~~~
12:06:45 PM: 
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-button-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:2:35:
12:06:45 PM:       2 │ import { HlmButtonDirective } from '@spartan-ng/ui-button-helm';
12:06:45 PM:         ╵                                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-button-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-card-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:4:175:
12:06:45 PM:       4 │ ...dImports, HlmCardTitleDirective, } from '@spartan-ng/ui-card-helm';
12:06:45 PM:         ╵                                            ~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-card-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-icon-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:7:47:
12:06:45 PM:       7 │ ...{ HlmIconComponent, provideIcons } from '@spartan-ng/ui-icon-helm';
12:06:45 PM:         ╵                                            ~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-icon-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-input-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:8:34:
12:06:45 PM:       8 │ import { HlmInputDirective } from '@spartan-ng/ui-input-helm';
12:06:45 PM:         ╵                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-input-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-label-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:9:34:
12:06:45 PM:       9 │ import { HlmLabelDirective } from '@spartan-ng/ui-label-helm';
12:06:45 PM:         ╵                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-label-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-checkbox-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:12:37:
12:06:45 PM:       12 │ import { HlmCheckboxComponent } from '@spartan-ng/ui-checkbox-helm';
12:06:45 PM:          ╵                                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-checkbox-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: ✘ [ERROR] Could not resolve "@spartan-ng/ui-badge-helm"
12:06:45 PM:     src/app/components/home/home.component.ts:14:34:
12:06:45 PM:       14 │ import { HlmBadgeDirective } from '@spartan-ng/ui-badge-helm';
12:06:45 PM:          ╵                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~
12:06:45 PM:   You can mark the path "@spartan-ng/ui-badge-helm" as external to exclude it from the bundle, which will remove this error and leave the unresolved path in the bundle.
12:06:45 PM: 
12:06:45 PM: ​
12:06:45 PM: "build.command" failed

Other information

No response

I would be willing to submit a PR to fix this issue

• Yes
• No

[rifayetuxbd]

This issue mainly occurring because of the paths in tsconfig.json file.

Replacing your paths like below will solve the issue.

tsconfig.json

{
     // ............................ Others
    "paths": {
      "@spartan-ng/ui-alert-helm": ["./libs/ui/ui-alert-helm/src/index.ts"],
      "@spartan-ng/ui-alertdialog-helm": [
        "./libs/ui/ui-alertdialog-helm/src/index.ts"
      ],
      "@spartan-ng/ui-aspectratio-helm": [
        "./libs/ui/ui-aspectratio-helm/src/index.ts"
      ],
      // .......................... Others
    }
}

[im-ashar]

@rifayetuxbd thanks, this resolved my issue.