Errores: la ruta de datos ".builders ['app-shell']" debería haber requerido la propiedad 'class'


160

Recibo este error mientras ejecuto mi aplicación. Aquí están los detalles de mi solicitud.

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

Ya he intentado limpiar el caché.


Aquí está el detalle de mi solicitud. CLI angular: 7.3.3 Nodo: 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 @ esquemas / actualización 0.13.3 rxjs 6.3.3 mecanografiado 3.2.4 webpack 4.30.0
Ekta Gandhi

1
Este problema generalmente se debe a paquetes incompatibles. ¿Has actualizado recientemente package.json?
Deepika

77
Finalmente encontré la solución. 1) Primero elimine todos los cambios en el archivo package.json dando el comando simple git checkout package.json. 2) Luego, después de hacer el cambio en package.json en @ angular-devkit / build-angular- ~ 0.800.1 (Agregar cola en lugar de cap) 3) Luego ejecutar el comando rm -rf node_modules / 4) Luego limpiar la captura dando el comando npm limpiar caché -f 5) Y finalmente ejecutar el comando npm install. Esto funciona para mi.
Ekta Gandhi

1
Arriba, npm clean cache -festá mal, debería estarlo npm cache clean --force.
Fabien Haddadi

2
Lo que encontré es que había configurado nvm para usar la versión incorrecta del nodo, necesitaba configurarlo correctamente usando nvm use 12.14.01(en mi caso)
QuietSeditionist

Respuestas:


173

En su package.json cambie el generador de devkit.

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

a

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

esto funciona para mi.
buena suerte.


31
Hecho @angular-devkit/build-angular": "0.13.4"y funcionó.
Dimuthu

3
Perfecto. Trabajó con "0.13.4", y ejecutó la compilación npm después
SouravOrii

1
Aterricé aquí porque recibí una notificación sobre una vulnerabilidad de seguridad detectada en js-yaml <3.13.1. Después de actualizar, recibí este mensaje de error. De todos modos, lo "^0.10.0"arregló.
Alesh Houdek

11
el 0.13.4 funcionó para mí, sin embargo, asegúrese de eliminar primero la carpeta node_modules, elimine el paquete-lock.json y luego ejecute npm install. Parece arreglar todo.
Indy-Jones

55
Esta solución funciona pero está mal, en su lugar, debe actualizar la versión angular y angular cli. Verifique la respuesta de @ovangle a continuación
Francesco Borzi

101

Siguiente funcionó para mí

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

3
Aunque esta respuesta es directa, también carece de recursos o referencias. A ciegas, las personas que instalan directamente una versión de paquete particular pueden interrumpir todo su proyecto. Sea claro y proporcione alguna referencia.
Zakky

70

Todos aquí se están enfocando en degradar las versiones de @ angular-devkit / build-angular a @angular 7.x por compatibilidad, pero lo que deberían hacer es actualizar @angular/clia las versiones de angular 8.

El problema es que el cli del sistema todavía está atascado en una versión anterior y no se actualiza automáticamente ng update(porque está fuera del proyecto controlado angular), por lo que se deja en una versión incompatible al intentar acceder a las bibliotecas angulares.

La degradación @angular-devkit/build-angularsolo causa más incompatibilidades.

npm i --global @angular/cli@latest

solucionará el problema sin romper las cosas en otro lugar.


66
Esta debería ser la respuesta. Este error se me ocurrió porque extraje de una rama que se actualizó a Angular 8 pero el angular de mi computadora sigue siendo Angular 7.
terahertz

19
Este problema puede ocurrir cuando lo hace npm audit fixen proyectos que aún están en angular@7@angular-devkit/build-angular
ejecución,

44
correr a npm audit fixveces introduce cambios de frenado. en su lugar, deberíamos correr npm auditpara comprender los hallazgos y actualizar el paquete 1 por 1 usando algo comonpm i --save-dev <package@version>
Naren

1
@zhuhang Eso es evidentemente falso. Puede esperar que la actualización de la CLI global sea compatible con las últimas versiones, no necesariamente puede ser compatible con versiones anteriores.
ovangle

1
@ovangle No mencioné la compatibilidad con versiones posteriores. Estoy diciendo que las personas no deberían actualizar o degradar ciegamente, especialmente la angular-cliversión. Uno debe identificar su versión actual de CLI y usar el devkit que coincida con esa CLI. Si desea actualizar los paquetes de devkit, actualizar CLI es correcto.
zhuhang.jasper

62

Todos se están enfocando en la @angular-devkit/build-angularversión anterior a X, o la @angular/cliversión actualizada a Y o más reciente.

Sin embargo, no sugiera ciegamenteX or Y or latest como respuesta. (Aunque, por lo general, degradar Devkit debería ser mejor porque actualizar CLI es un cambio radical)

La versión correcta para elegir, siempre depende de su versión Angular (angular-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

Para otras versiones específicas, visite: https://github.com/angular/angular-cli/tags . Encuentre su versión de CLI, y en algunas etiquetas, mencionan las versiones correspondientes para los @angular-devkit/**paquetes.

Nota: Si desea actualizar su versión de CLI, primero debe considerar actualizar a la última versión de su versión principal, no simplemente salte a la siguiente versión principal.


3
No estoy seguro de por qué esta respuesta fue rechazada; Es un buen consejo. De hecho, resolvió mi problema (ya que había actualizado mi devkit/build-angularpaquete 0.803.xpero dejé mi CLI Angular en 7.3.x. Como no tenía la intención de actualizar mi CLI Angular, volví a usar ver 0.13.xde devkit
Gregg L

2
@GreggL De hecho, mi respuesta es mejor que la que tiene más votos a favor. Otras respuestas simplemente sugieren actualizar / degradar a ciegas. Como sugiere mi respuesta, la versión correcta de CLI / devkit se correlaciona, pero nadie da una F, porque así es la comunidad de desarrolladores.
zhuhang.jasper

Eres un salvavidas, tx! ¿Pero tienes alguna idea para cli 7.0.6? No está escrito allí
Erhan Yaşar

2
Para agregar a esta gran respuesta: en mi propio proyecto, incluyo @angular/clien las dependencias de desarrollo y me aseguro de que coincida con el @angular-devkit/build-angular. De esa manera puedo mantener múltiples proyectos con múltiples versiones de CLI. Si lo hace ng s, usará la CLI de su computadora, si lo hace npm start(que es una secuencia de comandos package.jsonpara hacerlo ng serve, en realidad usará la CLI local, lanzará esta aplicación con la CLI correcta. Espero que esto ayude
ma.D

Actualizado para Angular 9, a partir de hoy (fuente NPM ): 0.901.1 -> más reciente, 0.1000.0-siguiente.0 -> siguiente, 0.8.9 -> v6-lts, 0.803.26 -> v8-lts, 0.13 .10 -> v7-lts
Massimiliano Caniparoli

30

Su @ angular-devkit es incompatible con la versión @ angular / cli, así que simplemente instale una versión anterior como esta, por ejemplo:

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

Quería publicar el mismo. Visto 0.12.4flotando, pero esto no funciona para mí.
M. Doe

@ M.Doe La versión correcta depende de su versión 1angular-cli`. Vea esto: stackoverflow.com/a/59043569/6122411
zhuhang.jasper el

22

Mismo problema después de intentar actualizar a Ng8 que falló debido a problemas de dependencia.

npm uninstall @angular-devkit/build-angular

entonces solía

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

arreglado...


a veces esta solución no es factible porque su versión podría no ser un requisito de alguien. Eliminar paquete de bloqueo jsonnpm i @angular-devkit/build-angular
Tejashree

14

Tuve el mismo problema, pero lo resolví gracias al comentario de Ekta Gandhi:

Finalmente encontré la solución.

1) Primero elimine todos los cambios en el archivo package.json dando el comando simple git checkout package.json.

2) Luego, después de hacer un cambio en package.json en @ angular-devkit / build-angular- ~ 0.800.1 (Agregar cola en lugar de cap)

3) Luego ejecute el comando rm -rf node_modules /

4) Luego limpie catch dando el comando npm clean cache -f

5) Y finalmente ejecuta el comando npm install. Esto funciona para mi.

.... Junto con la modificación propuesta por Dimuthu

Llegó a @ angular-devkit / build-angular ":" 0.13.4 "y funcionó.


Cabe señalar que la versión "0.13.4" de @ angular-devkit / build-angular tiene un problema al usar componentes con carga lenta. Para evitar ese problema los usuarios necesitan actualizar su @ angular DevKit / paquete build-angular ... Así especie de una solución de compromiso aquí ...
Adan

7

Esto me sucedió cuando instalé Angular 8, hay algunas incompatibilidades que no pude resolver. Tuve que degradar porque bajé por la madriguera del conejo haciendo malabares con cada versión hasta que encontré una que funcionara.

Primero, TypeScript estaba desactualizado, la instalación predeterminada agregó una referencia a TypeScript 3.1.6 y requiere 3.4 o superior.

npm install typescript@">=3.4 <3.5"

Segundo, usar el devkit 0.800.1 o 0.800.1 siempre terminaba en incompatibilidades. Probé muchas combinaciones, pero todavía no estoy seguro de que sea totalmente compatible, especialmente porque estoy usando un bootstrap un poco más antiguo y aún no puedo actualizar.

Finalmente traté de degradar (vaya a package.json y encuentre devDependencies) hasta que uno de ellos funcionó.

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

Estoy seguro de que su problema son las versiones de dependencias, pero no puedo decir cuál. Pruébalo degradando.


Si bien funciona, sugeriría @angular-devkit/build-angular": "0.13.8"que parece ser la última versión que funciona
M. Doe

Muchas gracias. Parece que la versión de bootstrap o las dependencias no me permiten subir más de 0.13.4, pero funcionaría para muchas personas
Maximiliano Rios

Con 0.13.8 (esencialmente algo inferior a 0.800. *) Obtengo: 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 la última versión obtengo un error del título. ¿Qué hacer ahora?
Dominik Szymański

7

Intente actualizar el archivo package.json desde

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

a

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

Luego ejecute npm install en la línea de comando.


6

También me encontré con este problema y, cuando hice más actualizaciones, se produjeron más problemas.

Lo que funcionó para mí al final fue más o menos eliminar el cli angular y volver a instalarlo con estos pasos:

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

esto me ayudó a fuente: cómo desinstalar angular / cli


3

Hice este cambio en el archivo package.json, luego funciona.

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

a

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


2

He cambiado @angular-devkit/build-angular": "0.9.0.1"a @angular-devkit/build-angular": "0.13.4"y funcionó.


Funcionó para mí, también tuve que ejecutar npm install para asegurarme de que se descargó la versión correcta.
David Brunning

2

También me enfrenté a este problema y tuve problemas para resolverlo, he probado todas las opciones anteriores pero nada resolvió mi problema. Este problema se produce debido a la falta de coincidencia de versiones de angular / cli y angular-devkit, por lo que hice lo siguiente:

  1. Versión de archivos modificada manualmente:

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

    @angular/cli": "~7.0.3", // Esto es para Angular7, para Angular8: 0.803.23

  2. Paquete-lock.json eliminado

  3. Ejecutado: npm install

Resolvió mi problema.


1

Por mi parte, era un paquete

@ angular-devkit / build-angular

y

@ angular-devkit / build-ng-packagr

no era la misma versión, actualizar build-ng-packagra la misma versión que build-angularsolucionó mi problema.



0

Simplemente puede auditar su código y luego

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

-1

Tiene dependencias incompatibles. Resolví este problema cambiando el package.json de otro proyecto angular y luego, después de cambiar a este packag.json, solo cambia las versiones de dependencias que tiene.

después del cambio escriba:

-npm enlace

-npm servir -o

entonces es trabajo :)

   {
   "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"
   }

Lo he intentado y me da los mismos errores de error: la ruta de datos "" NO debería tener propiedades adicionales (es5BrowserSupport).
Ekta Gandhi

-1

Tuve este problema, así es como lo he resuelto. El problema es que su versión Angular no es compatible con su versión Node.js para la compilación. Entonces, la mejor solución es actualizar su Node.js a la versión estable más actual.

Para una actualización limpia de Node.js, aconsejo usar n. si estás usando Mac

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

y ahora verifique que esté actualizado:

node -v
npm -v

Para más detalles, consulte este enlace: aquí


Estaría feliz de saber por qué obtuve este voto negativo. Esta es una respuesta clara, sin tratar de tener algunas "soluciones"
arielb

porque no está relacionado con la versión del nodo, debería ser la versión angular-cli.
zhuhang.jasper el

Acabo de tener este problema, no creo que sea la versión angular-cli, está relacionado con la versión angular-cli pero está afectada por la versión del nodo.
arielb

-1

Ninguna de las respuestas anteriores funciona para mí.

Mi objetivo original era arreglar la compilación a veces CONSTANTE de mi proyecto con VSCode.

Lo intenté de muchas maneras, pero NADA funcionó: ¡ el proyecto NO SE COMPILARÁ!

Finalmente descubrí cuál es el problema aquí:

Cloné el proyecto desde el repositorio de mi compañía, y todo el código de allí TIENE que ir exactamente con las versiones de las dependencias cuando se codificó la parte existente del proyecto.

Al final, eliminé el proyecto previamente clonado OTRA VEZ (bastantes veces) , y cloné OTRA VEZ (también algunas veces) , y NO HIZO NADA PERO CORRÍA "npm install", y todo comenzó a funcionar .

La lección que aprendí aquí es que:

A veces empeorará la situación cuando intente solucionar algunos problemas (el que tuve fue la COMPILACIÓN CONSTANTE de mi proyecto).

Pero eso no significa que no podamos intentar solucionar los problemas. Podemos. Pero cuando todo se vuelve un desastre, será mejor que sigamos con el código original.

Afortunadamente, la COMPILACIÓN CONSTANTE de mi proyecto ocurre solo de vez en cuando, no todo el tiempo. No está arreglado, pero tengo que soportarlo, de lo contrario mi proyecto ni siquiera se compilará.


-2

es trabajo reinstalar @ angular-devkit / build-angular @ 0.13.4

npm install @angular-devkit/build-angular@0.13.4 --save-dev
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.