ng-components: Erro após adicionar ng-components

[josuelsilva]

Reprodução

Utilize StackBlitz (https://stackblitz.com/edit/po-ui) para reproduzir o bug relatado na issue.

Passos para reproduzir:

1. Criar o projeto com ng new my-po-project --skip-install
2. npm install
3. ng add @po-ui/ng-components
4. ng serve
5. acessar localhost:4200

Qual o comportamento atual?

Ao abrir a tela no navegador, a pagina fica em branco. Quando é inspecionado a pagina, virmos que está gerando um erro do modulo @angular
O erro ocorre para a versão 19

Segue erro abaixo

Que comportamento você esperava ver?

Abrir a tela com projeto inicial

Ambiente

• PO UI:
• Angular:
• Browser(s):
  • Chrome
  • Firefox
  • Edge
  • Safari
  • IE 11
  • Outros
• Operating System:
  • Windows
  • macOS
  • Ubuntu
  • Outros

Observações

Tempo de Resposta PO UI --> Em até 7 dias úteis.
Tempo de Retorno Solicitante --> 35 dias corridos
Issues sem retorno do solicitante por mais de 35 dias corridos serão encerradas.

[anabye]

Oi @josuelsilva, bom dia!

A versão 19.1.7 do Angular, lançada na semana passada, introduziu um erro que impacta não apenas nossa biblioteca, mas também outras, conforme relatado na issue #17730.

Para evitar problemas de compatibilidade, recomendamos utilizar as versões do Angular conforme nossa documentação:

"dependencies": {
    "@angular/animations": "~19.0.0",
    "@angular/common": "~19.0.0",
    "@angular/compiler": "~19.0.0",
    "@angular/core": "~19.0.0",
    "@angular/forms": "~19.0.0",
    "@angular/platform-browser": "~19.0.0",
    "@angular/platform-browser-dynamic": "~19.0.0",
    "@angular/router": "~19.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.15.0"
    ...
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~19.0.5",
    "@angular-devkit/schematics": "~19.0.5",
    "@angular/cli": "~19.0.5",
    "@angular/compiler-cli": "~19.0.0",
    ...
    "typescript": "~5.6.2"
  }

Atenciosamente.

[josuelsilva]

Olá @anabye , obrigado pelas informações.
Mesmo fazendo o procedimento que informou, ainda sim, apresenta o mesmo erro.

[anabye]

@josuelsilva obrigada por partilhar o package.

Para evitar incompatibilidades, a documentação orienta utilizar " ~ " ao invés de " ^ ". Segue o package.json atualizado:

  "dependencies": {
    "@angular/animations": "~19.0.0",
    "@angular/common": "~19.0.0",
    "@angular/compiler": "~19.0.0",
    "@angular/core": "~19.0.0",
    "@angular/forms": "~19.0.0",
    "@angular/platform-browser": "~19.0.0",
    "@angular/platform-browser-dynamic": "~19.0.0",
    "@angular/router": "~19.0.0",
    "@po-ui/ng-components": "^19.4.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.15.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~19.0.5",
    "@angular-devkit/schematics": "~19.0.5",
    "@angular/cli": "~19.0.5",
    "@angular/compiler-cli": "~19.0.0",
    "@types/jasmine": "~5.1.0",
    "jasmine-core": "~5.4.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "typescript": "~5.6.2"
  }

Atenciosamente.