Errors: Data path “.builders['app-shell']” should have required property 'class'

Question

I am getting this error while running my application. Here are the details of my application.

Angular CLI: 7.3.3 
Node: 10.15.1 
Angular: 7.2.7 
@angular-de         


        

Answer 1

it's work reinstall @angular-devkit/build-angular@0.13.4

npm install @angular-devkit/build-angular@0.13.4 --save-dev

Answer 2

Your @angular-devkit is incompatible with @angular/cli version, so just install older one like this for example:

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

Answer 3

This happened to me when I installed Angular 8, there are some incompatibilities I couldn't solve. I had to downgrade because I went down the rabbit hole juggling around with every version until I found one that worked.

First, TypeScript was outdated, the default installation added a reference to TypeScript 3.1.6 and it requires 3.4 or greater.

npm install typescript@">=3.4 <3.5"

Second, using the devkit 0.800.1 or 0.800.1 always ended up in incompatibilities. I tried many combinations but I am not sure it's fully compatible yet, specially because I am using one bootstrap a bit older and I cannot upgrade yet.

Finally I tried to downgrade (go to package.json and find the devDependencies) until one of them worked.

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

I am sure your problem is dependencies versions but I cannot tell you which one. Give it a try downgrading.

Answer 4

Everyone here is focusing on downgrading @angular-devkit/build-angular to @angular 7.x versions for compatibility, but what they should be doing is to upgrade @angular/cli to angular 8 versions.

The problem is that the system cli is still stuck at an old version and isn't automatically updated by ng update (because it is outside the angular controlled project), so it is being left at an incompatible version when trying to access the angular libraries.

Downgrading @angular-devkit/build-angular just causes more incompatibilities.

npm i --global @angular/cli@latest

will fix the problem without breaking things elsewhere.

Answer 5

You have incompatibly dependencies i solved this problem by change the package.json form another project angular and then after change to this packag.json, you change only the dependencies versions you have.

after the change write:

-npm link

-npm serve -o

then it's work :)

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

Answer 6

NONE of the above-given answers works for me.

My original goal was to fix the sometimes CONSTANT COMPILING of my project with VSCode.

I tried many, many ways, but NOTHING was working -- the project just WON'T COMPILIE!

Finally I found out what the problem here is:

I cloned the project from my company's repository, and all the code from there HAS TO go exactly with the versions of dependencies when the existing part of the project was coded.

In the end, I deleted the previously cloned project AGAIN (quite a few times), and cloned AGAIN (also a few times), and DID NOTHING BUT RAN "npm install", and everything started to work.

The lesson I learned here is that:

Sometimes you'll make the situation worse when you try to fix some problems (the one I had was the CONSTANT COMPILING of my project).

But it doesn't mean we cannot try to fix the problems. We can. But when everything becomes a mess, we'd better go with the original code.

Fortunately the CONSTANT COMPILING of my project happens only once a while, not all the time. It's not fixed, but I have to bear with it, otherwise my project won't even compile.