web-dev-qa-db-fra.com

Angular Build - UnCaught TypeError: Impossible de lire la propriété 'id' d'undefined

J'ai réussi à construire mon angular en tant que build de développement. Je ne l'ai pas encore fait en tant que build de production car cela me donne quelques erreurs et j'ai juste besoin de tester la build de développement .

Le processus de développement des développeurs se passe bien, sans erreur ou quoi que ce soit. J'utilise ensuite les fichiers du dossier dist dans un conteneur docker nginx pour héberger les fichiers.

Le problème est que rien ne s'affiche mais une page blanche et dans la console, j'obtiens une erreur disant 'TypeError non capturé: Impossible de lire la propriété' id 'd'undefined'. Le message complet ci-dessous ne semble pas indiquer quoi que ce soit que j'ai écrit et j'ai passé plusieurs heures à chercher en ligne, mais je ne trouve rien sur ce problème.

enter image description here

J'ai essayé quelques choses différentes telles que l'exécution de 'npx ivy-ngcc' que j'ai lu compile manuellement des trucs. Existe-t-il de toute façon que je peux obtenir plus de détails sur l'erreur pour voir si c'est quelque chose que j'ai fait?

[~ # ~] mise à jour [~ # ~] J'ai donc restauré la ligne que j'ai commentée dans main.ts comme mentionné dans les commentaires ci-dessous. J'ai également essayé 'ng build --aot' comme suggéré, ce qui me présente une série d'erreurs qui semblent toutes se rapporter aux composants devextreme utilisés. Je trouve cela étrange quand j'ai commencé le projet avec le projet de démarrage devextreme angular de github.

je reçois des messages tels que:

  1. 'dx-scroll-view n'est pas un élément HTML valide'

  2. 'node_modules/devextreme-angular/ui/tiroir.d.ts - erreur: apparaît dans les NgModule.imports de SideNavOuterToolbarModule, mais n'a pas pu être résolu en une classe NgModule'

node.jsangularwebpackangular-cli
8
user7856951

J'ai réussi à résoudre le problème en désactivant ivy dans les options de compilation angular.

Merci à tous ceux qui ont offert de l'aide :)

4
user7856951

J'ai eu le même problème et l'ai résolu en passant de

loadChildren: './app/page/account/account.module#AccountModule'

à

loadChildren: () =>
  import('./app/page/account/account.module').then(
    (m) => m.AccountModule
  )

dans app-router.module.ts

0
Thomas

enter image description here

Si vous allez dans les devtools et cliquez sur Sources, "Ne faites pas de pause sur les exceptions" et cochez "Pause sur les attentes interceptées" et continuez jusqu'à ce que vous obteniez l '"erreur id", vous trouverez quel module l'erreur est levée. Dans mon cas, il y avait une bibliothèque tierce appelée 'ngx-card/ngx-card' et son module était la cause de l'erreur (CardModule). J'espère que cela vous aidera à trouver au moins la cause de l'erreur

enter image description here

0
Rodrigo Búrigo Esmeraldino

Espérons que cela aide une autre pauvre âme.

Pour toute personne utilisant devextreme, assurez-vous de mettre à jour votre version à au moins 19.2.5

https://github.com/DevExpress/devextreme-angular/issues/975#issuecomment-580172291

À partir de la version 19.2.5, nous prenons en charge le compilateur IVY.

0
Josh96

En règle générale, si ce n'est pas quelque chose que vous avez écrit, cela a tendance à être un problème avec votre mise en œuvre - c'est-à-dire "Visiter un vendeur de nourriture et commander un aliment qu'il ne fournit pas".

Je sais que ce n'est pas une réponse spécifique, mais s'assurer que vous avez correctement configuré les choses dans votre module d'application serait une bonne première étape. Peut-être que tenter de construire avec AOT vous donnera également quelques échecs plus verbeux qui découlent de la tentative de construire.

0
user1211530