Errori: il percorso dati ".builders ['app-shell']" dovrebbe aver richiesto la proprietà 'class'


160

Ricevo questo errore durante l'esecuzione della mia applicazione. Ecco i dettagli della mia domanda.

Angular CLI: 7.3.3 
Node: 10.15.1 
Angular: 7.2.7 
@angular-devkit/architect -0.13.3 
@angular-devkit/build-angular- 0.800.1 
@angular-devkit/build-optimizer - 0.800.1 
@angular-devkit/build-webpack - 0.800.1 
@angular-devkit/core -7.3.3 
@angular-devkit/schematics -7.3.3 
@angular/cli -7.3.3 
@ngtools/webpack -8.0.1 
@schematics/angular -7.3.3 
@schematics/update 0.13.3 
rxjs 6.3.3 
typescript 3.2.4 
webpack 4.30.0

Ho già provato a pulire la cache.


Ecco i dettagli della mia applicazione. CLI angolare: 7.3.3 Nodo: 10.15.1 Angolare: 7.2.7 @ angular-devkit / architetto -0.13.3 @ angular-devkit / build-angular- 0.800.1 @ angular-devkit / build-optimizer - 0.800.1 @ angular-devkit / build-webpack - 0.800.1 @ angular-devkit / core -7.3.3 @ angular-devkit / schemi -7.3.3 @ angular / cli -7.3.3 @ ngtools / webpack -8.0.1 @schematics / angular -7.3.3 @ schematics / update 0.13.3 rxjs 6.3.3 dattiloscritto 3.2.4 webpack 4.30.0
Ekta Gandhi

1
Questo problema è generalmente dovuto a pacchetti incompatibili. Hai aggiornato di recente package.json?
Deepika,

7
Finalmente ho trovato la soluzione. 1) Innanzitutto elimina tutte le modifiche al file package.json dando un semplice comando git checkout package.json. 2) Quindi, dopo aver apportato le modifiche a package.json in @ angular-devkit / build-angular- ~ 0.800.1 (Aggiungi coda invece di cap) 3) Quindi esegui il comando rm -rf node_modules / 4) Quindi pulisci la cattura dando il comando npm clean cache -f 5) E infine esegui il comando npm install. Questo funziona per me.
Ekta Gandhi,

1
Sopra, npm clean cache -fè sbagliato, dovrebbe essere npm cache clean --force.
Fabien Haddadi,

2
Quello che ho scoperto è che avevo impostato nvm per usare la versione sbagliata del nodo, necessario per impostarlo correttamente usando nvm use 12.14.01(nel mio caso)
QuietSeditionist

Risposte:


173

Nel tuo package.json cambia il builder devkit.

"@angular-devkit/build-angular": "^0.800.1",

per

"@angular-devkit/build-angular": "^0.10.0",

per me funziona.
in bocca al lupo.


31
Ce l'ha fatta @angular-devkit/build-angular": "0.13.4"e ha funzionato.
Dimuthu,

3
Perfetto. Ha funzionato con "0.13.4" e successivamente ha eseguito npm build
SouravOrii,

1
Atterrato qui perché ho ricevuto una notifica relativa a una vulnerabilità di sicurezza rilevata in js-yaml <3.13.1. Dopo l'aggiornamento ho ricevuto questo messaggio di errore. Comunque, "^0.10.0"riparato.
Alesh Houdek,

11
lo 0.13.4 ha funzionato per me, tuttavia assicurati di rimuovere prima la cartella node_modules, eliminare il pacchetto-lock.json e quindi eseguire npm install. sembra sistemare tutto.
Indy-Jones,

5
Questa soluzione funziona ma è sbagliata, dovresti invece aggiornare la versione cli angolare e angolare. Controlla la risposta @ovangle di seguito
Francesco Borzi,

101

Il seguito ha funzionato per me

npm uninstall @angular-devkit/build-angular
npm install @angular-devkit/build-angular@0.13.0

3
Sebbene questa risposta sia diretta, manca anche di risorse o riferimenti. Le persone direttamente alla cieca che installano una particolare versione del pacchetto possono interrompere l'intero progetto. Si prega di essere chiari e fornire alcuni riferimenti.
Zakky il

70

Tutti qui si stanno concentrando sul downgrade di @ angular-devkit / build-angular alle versioni di @angular 7.x per compatibilità, ma ciò che dovrebbero fare è aggiornare@angular/cli alle versioni angolari 8.

Il problema è che il cli di sistema è ancora bloccato in una versione precedente e non viene aggiornato automaticamente da ng update (perché è al di fuori del progetto controllato angolare), quindi viene lasciato in una versione incompatibile quando si tenta di accedere alle librerie angolari.

Il downgrade @angular-devkit/build-angularprovoca solo più incompatibilità.

npm i --global @angular/cli@latest

risolverà il problema senza rompere le cose altrove.


6
Questa dovrebbe essere la risposta. Questo errore mi è venuto in mente perché mi sono ritirato da un ramo che è stato aggiornato ad Angular 8 ma l'angolo del mio computer è ancora angolare 7.
terahertz,

19
questo problema può verificarsi quando lo fai npm audit fixsu progetti che sono ancora angular@7@angular-devkit/build-angular
attivi,

4
la corsa a npm audit fixvolte introduce cambiamenti di frenata. dovremmo invece correre npm auditper capire i risultati e aggiornare il pacchetto 1 per 1 usando qualcosa comenpm i --save-dev <package@version>
Naren,

1
@zhuhang Questo è palesemente falso. Puoi aspettarti che l'aggiornamento della CLI globale sia retrocompatibile con le ultime versioni, non puoi necessariamente aspettarti che sia compatibile in avanti.
ovangiare il

1
@ovangle Non ho menzionato compatibile in avanti. Sto dicendo che le persone non dovrebbero aggiornare o downgrade alla cieca, specialmente la angular-cliversione. È necessario identificare la versione corrente della CLI e utilizzare devkit corrispondente a tale CLI. Se si desidera aggiornare i pacchetti devkit, l'aggiornamento del CLI è del tutto corretto.
zhuhang.jasper,

62

Tutti si stanno concentrando sul downgrade della @angular-devkit/build-angularversione a X o sull'aggiornamento della @angular/cliversione a Y o più recente.

Tuttavia, per favore non suggerire ciecamenteX or Y or latest come risposte. (Anche se di solito, il downgrade di devkit dovrebbe essere migliore perché l'aggiornamento della CLI è un cambiamento decisivo)

La versione corretta da scegliere dipende sempre dalla versione angolare (angolare-cli).

Angular CLI v8.3.19 -> 0.803.19
Angular CLI v8.3.17 -> 0.803.17
Angular CLI v7.3.8 -> 0.13.8
Angular CLI v6-lts -> 0.8.9

Per altre versioni specifiche, visitare: https://github.com/angular/angular-cli/tags . Trova la tua versione della CLI e, in alcuni tag, menzionano le versioni corrispondenti per i @angular-devkit/**pacchetti.

Nota: se si desidera aggiornare la versione dell'interfaccia della riga di comando, è necessario innanzitutto prendere in considerazione l'aggiornamento alla versione più recente della versione principale, non passare semplicemente alla versione principale successiva.


3
Non sono sicuro del motivo per cui questa risposta è stata votata in negativo; è un buon consiglio. In effetti, ha risolto il mio problema (dato che avevo aggiornato il mio devkit/build-angularpacchetto 0.803.xma avevo lasciato la mia CLI angolare a 7.3.x. Dato che non avevo intenzione di aggiornare la mia CLI angolare, sono tornato a usare ver 0.13.xdi devkit
Gregg L

2
@GreggL In effetti, la mia risposta è migliore di quella con più voti. Altre risposte suggeriscono semplicemente di aggiornare / eseguire il downgrade BLINDLY. Come suggerisce la mia risposta, la corretta versione CLI / devkit è correlata, ma nessuno dà una F, perché è così che è la comunità dev.
zhuhang.jasper,

Sei un vero toccasana, grazie! Ma hai qualche idea per cli 7.0.6? Non ha scritto lì
Erhan Yaşar il

2
Per aggiungere a questa grande risposta: Nel mio progetto, includo @angular/clile dipendenze degli sviluppatori e mi assicuro che corrisponda al @angular-devkit/build-angular. In questo modo posso gestire più progetti con più versioni della CLI. Se lo fai ng s, userai la CLI del tuo computer, se lo fai npm start(che è uno script package.jsonper farlo ng serve, utilizzerà effettivamente la CLI locale, avvierà questa app con la CLI giusta. Spero che questo aiuti
ma.D

Aggiornato per Angular 9, a partire da oggi (sorgente NPM ): 0.901.1 -> più recente, 0.1000.0-next.0 -> successivo, 0.8.9 -> v6-lts, 0.803.26 -> v8-lts, 0.13 .10 -> v7-lts
Massimiliano Caniparoli,

30

@ Angular-devkit non è compatibile con la versione @ angular / cli, quindi ad esempio installane uno precedente come questo:

npm install @angular-devkit/build-angular@0.13.8 @angular-devkit/build-ng-packagr@0.13.8

Volevo pubblicare lo stesso. Visto 0.12.4galleggiare intorno, ma questo non funziona per me.
M. Doe,

@ M.Doe La versione corretta dipende dalla versione di 1angular-cli`. Vedere questo: stackoverflow.com/a/59043569/6122411
zhuhang.jasper

22

Stesso problema dopo aver tentato l'aggiornamento a Ng8 che non è riuscito a causa di problemi di dipendenza.

npm uninstall @angular-devkit/build-angular

poi ho usato,

npm install @angular-devkit/build-angular@0.12.4

aggiustato...


a volte questa soluzione non è fattibile perché la sua versione potrebbe non essere richiesta da qualcuno. Elimina pacchetto blocco jsonnpm i @angular-devkit/build-angular
Tejashree il

14

Ho avuto lo stesso problema, ma l'ho risolto grazie al commento di Ekta Gandhi:

Finalmente ho trovato la soluzione.

1) Innanzitutto elimina tutte le modifiche al file package.json dando un semplice comando git checkout package.json.

2) Quindi, dopo aver apportato la modifica in package.json in @ angular-devkit / build-angular- ~ 0.800.1 (Aggiungi coda anziché cappuccio)

3) Quindi eseguire il comando rm -rf node_modules /

4) Quindi pulire la cattura dando il comando npm clean cache -f

5) E infine esegui il comando npm install. Questo funziona per me.

.... Insieme alla modifica proposta da Dimuthu

È arrivato a @ angular-devkit / build-angular ":" 0.13.4 "e ha funzionato.


Va notato che la versione "0.13.4" di @ angular-devkit / build-angular ha un problema quando si usano componenti caricati in modo pigro. Per evitare questo problema, gli utenti devono aggiornare il loro pacchetto @ angular-devkit / build-angular ... Quindi una sorta di trade off qui ...
Adan

7

Questo mi è successo quando ho installato Angular 8, ci sono alcune incompatibilità che non sono riuscito a risolvere. Ho dovuto effettuare il downgrade perché sono andato giù nella tana del coniglio destreggiandosi in giro con ogni versione fino a quando non ho trovato quello che funzionava.

Innanzitutto, TypeScript era obsoleto, l'installazione predefinita ha aggiunto un riferimento a TypeScript 3.1.6 e richiede 3.4 o versioni successive.

npm install typescript@">=3.4 <3.5"

In secondo luogo, l'utilizzo di devkit 0.800.1 o 0.800.1 è sempre risultato incompatibile. Ho provato molte combinazioni ma non sono ancora sicuro che sia completamente compatibile, specialmente perché sto usando un bootstrap un po 'più vecchio e non riesco ancora ad aggiornare.

Alla fine ho provato a eseguire il downgrade (vai su package.json e trova devDependencies) fino a quando uno di loro ha funzionato.

@angular-devkit/build-angular": "0.13.4"

Sono sicuro che il tuo problema sono le versioni delle dipendenze, ma non posso dirti quale. Fai un tentativo di downgrade.


Mentre funziona, suggerirei @angular-devkit/build-angular": "0.13.8"che sembra essere l'ultima versione che funziona
M. Doe,

Molte grazie. Sembra dalla versione bootstrap o le dipendenze non mi permettono di andare oltre 0.13.4 ma funzionerebbe per molte persone
Maximiliano Rios,

Con 0.13.8 (sostanzialmente qualsiasi valore inferiore a 0.800. *) Ottengo: An unhandled exception occurred: Could not find the implementation for builder @angular-devkit/build-angular:browser See "/tmp/ng-5iKcHN/angular-errors.log" for further details.con l'ultima versione ottengo un errore dal titolo. Cosa fare adesso?
Dominik Szymański,

7

Prova ad aggiornare il file package.json da

  "@angular-devkit/build-angular": "^0.800.1" 

per

  "@angular-devkit/build-angular": "^0.12.4"

Quindi eseguire npm install nella riga di comando.


6

Mi sono anche imbattuto in questo problema e per me quando ho fatto più aggiornamenti si sono verificati più problemi.

Ciò che ha funzionato per me alla fine è stato più o meno quello di rimuovere la clip angolare e reinstallarla con questi passaggi:

npm uninstall -g @angular/cli
npm cache clean --force
npm install -g @angular/cli

questo mi ha aiutato a trovare la fonte: come disinstallare angular / cli


3

Ho fatto questa modifica nel file package.json, quindi funziona.

"@angular-devkit/build-angular": "^0.803.23"

per

"@angular-devkit/build-angular": "^0.13.9"


2

Ho cambiato @angular-devkit/build-angular": "0.9.0.1"per @angular-devkit/build-angular": "0.13.4"e ha funzionato.


Ha funzionato per me, dovevo anche eseguire npm install per garantire il download della versione corretta.
David Brunning,

2

Ho anche affrontato questo problema e ho lottato per ore per risolverlo, ho provato tutte le opzioni di cui sopra ma nulla ha risolto il mio problema. Questo problema si verifica a causa della mancata corrispondenza della versione di angular / cli e angular-devkit, quindi ho fatto quanto segue:

  1. Versione dei file modificata manualmente:

    @ angular-devkit / build-angular ":" ^ 0.13.9 ",

    @angular/cli": "~7.0.3", // Questo è per Angular7, per Angular8: 0.803.23

  2. Eliminato package-lock.json

  3. Eseguito: npm install

Ha risolto il mio problema.


1

Da parte mia era un pacchetto

@ Angolare-DevKit / build-angolare

e

@ Angolare-DevKit / build-ng-packagr

non era la stessa versione, l'aggiornamento build-ng-packagralla stessa versione build-angularrisolto il mio problema.


1

Se ti sposti a 8 o 9 angolari, questo funzionerà

ng update @angular/cli

0

Puoi semplicemente controllare il tuo codice e poi

#sudo su 
rm -rf package-lock.json node_modules
sudo npm i --save 

-1

Hai dipendenze incompatibili, ho risolto questo problema modificando il package.json da un altro progetto angolare e quindi, dopo la modifica a questo packag.json, cambi solo le versioni delle dipendenze che hai.

dopo la modifica scrivi:

-npm link

-npm serve -o

allora funziona :)

   {
   "name": "angular-jwt-auth",
   "version": "0.0.0",
   "scripts": {
   "ng": "ng",
   "start": "ng serve",
   "build": "ng build",
   "test": "ng test",
   "lint": "ng lint",
   "e2e": "ng e2e"
   },
   "private": true,
   "dependencies": {
   "@angular/animations": "^7.1.4",
   "@angular/cdk": "^7.3.1",
   "@angular/common": "~7.1.0",
   "@angular/compiler": "~7.1.0",
   "@angular/core": "~7.1.0",
   "@angular/forms": "~7.1.0",
   "@angular/http": "^6.1.10",
   "@angular/material": "^7.3.1",
   "@angular/platform-browser": "~7.1.0",
   "@angular/platform-browser-dynamic": "~7.1.0",
   "@angular/router": "~7.1.0",
   "@ng-bootstrap/ng-bootstrap": "^4.2.0",
   "@types/jquery": "^3.3.29",
   "angular-6-datatable": "^0.8.0",
   "bootstrap": "^4.3.1",
   "chart.js": "^2.8.0",
   "core-js": "^2.5.4",
   "jquery": "^3.4.1",
   "rxjs": "~6.3.3",
   "zone.js": "~0.8.26"
    },
   "devDependencies": {
   "@angular-devkit/build-angular": "~0.11.0",
   "@angular/cli": "~7.1.0",
   "@angular/compiler-cli": "~7.1.0",
   "@angular/language-service": "~7.1.0",
   "@types/chart.js": "^2.7.53",
   "@types/jasmine": "^2.8.16",
   "@types/jasminewd2": "^2.0.6",
   "@types/node": "~8.9.4",
   "codelyzer": "~4.2.1",
   "jasmine-core": "~2.99.1",
   "jasmine-spec-reporter": "~4.2.1",
   "karma": "~3.1.1",
   "karma-chrome-launcher": "~2.2.0",
   "karma-coverage-istanbul-reporter": "~2.0.1",
   "karma-jasmine": "~1.1.2",
   "karma-jasmine-html-reporter": "^0.2.2",
   "protractor": "~5.4.0",
   "ts-node": "~7.0.0",
   "tslint": "~5.11.0",
   "typescript": "~3.1.6"
   }

L'ho provato e mi dà gli stessi errori: il percorso dati "" NON dovrebbe avere proprietà aggiuntive (es5BrowserSupport).
Ekta Gandhi,

-1

Ho avuto questo problema, ecco come l'ho risolto. Il problema è principalmente che la tua versione angolare non supporta la tua versione Node.js per la build. Quindi la soluzione migliore è aggiornare il tuo Node.js a quello più attuale stabile.

Per un aggiornamento pulito di Node.js, consiglio di utilizzare n. se stai usando un Mac.

npm install -g n
npm cache clean -f
sudo n stable
npm update -g

e ora controlla di essere aggiornato:

node -v
npm -v

Per maggiori dettagli, controlla questo link: qui


Sarei felice di sapere perché ho ottenuto questo voto negativo. Questa è una risposta
chiara

poiché non è correlato alla versione del nodo, dovrebbe essere la versione angolare-cli.
zhuhang.jasper,

Ho appena avuto questo problema, non penso che sia la versione angular-cli, È correlata all'ang-cli ma è influenzata dalla versione del nodo.
Arielb,

-1

NESSUNA delle risposte sopra fornite funziona per me.

Il mio obiettivo originale era quello di correggere la compilazione a volte COSTANTE compilazione a del mio progetto con VSCode.

Ho provato molti, molti modi, ma NIENTE stava funzionando: il progetto NON COMPILA!

Alla fine ho scoperto qual è il problema qui:

Ho clonato il progetto dal repository della mia azienda e tutto il codice da lì DEVE andare esattamente con le versioni delle dipendenze quando è stata codificata la parte esistente del progetto.

Alla fine, ho cancellato ANCORA il progetto precedentemente clonato (alcune volte) , e clonato ANCORA (anche alcune volte) , e NON HO FATTO NIENTE RAN "npm install", e tutto ha iniziato a funzionare .

La lezione che ho imparato qui è che:

A volte peggiorerai la situazione quando proverai a risolvere alcuni problemi (quello che ho avuto è stato il COMPILING COSTANTE del mio progetto).

Ma ciò non significa che non possiamo provare a risolvere i problemi. Noi possiamo. Ma quando tutto diventa un casino, è meglio andare con il codice originale.

Fortunatamente la COSTANTE COMPILAZIONE del mio progetto avviene solo una volta ogni tanto, non sempre. Non è stato risolto, ma devo sopportarlo, altrimenti il ​​mio progetto non verrà nemmeno compilato.


-2

funziona reinstallare @ angular-devkit / build-angular @ 0.13.4

npm install @angular-devkit/build-angular@0.13.4 --save-dev
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.