swagger-api / swagger-api/swagger-ui

SwaggerUI not render with Angular 13, when the build optimizer is AOT

Open
#9,830 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
29k
Forks
9.3k
Avg merge
2d 23h
Merged PRs (30d)
25

Description

The Angular app is embedded in the Asp.net core application.

When the Azure ci/cd pipeline runs the below command -

<Exec Command="node --max_old_space_size=16384 node_modules/@angular/cli/bin/ng build --aot --build-optimizer=true --optimization=true --vendorChunk=true --sourceMap=false --configuration=production --output-hashing=all" />

The UI is not rendered. However, when I do the below command

<Exec Command="node --max_old_space_size=16384 node_modules/@angular/cli/bin/ng build --aot=false --build-optimizer=false --optimization=false --vendorChunk=false --sourceMap=false --configuration=production --output-hashing=all" />

The UI is rendered correctly. I can't change the above command because the Abp framework handles the cache. So I can't change to false

"swagger-ui": "^5.15.2",

ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor
    at new BM (70973.b4120c6a853870c0.js:1:876457)
    at wh (70973.b4120c6a853870c0.js:1:1404179)
    at cy (70973.b4120c6a853870c0.js:1:1425258)
    at Iy (70973.b4120c6a853870c0.js:1:1471991)
    at My (70973.b4120c6a853870c0.js:1:1459909)
    at Py (70973.b4120c6a853870c0.js:1:1459837)
    at dp (70973.b4120c6a853870c0.js:1:1459700)
    at Kh (70973.b4120c6a853870c0.js:1:1456440)
    at Ey (70973.b4120c6a853870c0.js:1:1456827)
    at xl (70973.b4120c6a853870c0.js:1:1396387)

image

Its seems to be like a similar issue as this one - https://github.com/swagger-api/swagger-ui/issues/9326

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the Angular 13 production build using the shown ng build command with swagger-ui 5.15.2, then compare it with the non-optimized command that renders correctly. Start by reviewing the reported stack trace and related issue 9326; done means the Swagger UI renders with AOT, build optimization, and production settings enabled.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, javascript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.