Angular-cli: Cannot read property 'host' of null with Angular v6.0.0-beta8

Created on 29 Mar 2018  ·  13Comments  ·  Source: angular/angular-cli

$ npm install @angular/cli@next
$ ng --version
_                      _                 ____ _     ___
/ \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
/ ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
|___/

Angular CLI: 6.0.0-beta.8
Node: 8.9.1
OS: win32 x64
Angular: 6.0.0-rc.0
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic, router

@angular/cdk: 6.0.0-beta-0
@angular/cli: 6.0.0-beta.8
@angular/material: 6.0.0-beta-0
@angular-devkit/architect: 0.0.9
@angular-devkit/core: 0.4.8
@angular-devkit/schematics: 0.4.8
@ngtools/json-schema: 1.1.0
@schematics/angular: 0.4.8
@schematics/update: 0.4.8
typescript: 2.8.1
webpack: error

I see webpack is error, what's wrong?
Then I tried to update the project

{
  "name": "angular6",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/core": "^0.4.8",
    "@angular/animations": "^6.0.0-rc.0",
    "@angular/cdk": "^6.0.0-beta.5",
    "@angular/common": "^6.0.0-rc.0",
    "@angular/compiler": "^6.0.0-rc.0",
    "@angular/core": "^6.0.0-rc.0",
    "@angular/forms": "^6.0.0-rc.0",
    "@angular/http": "^6.0.0-rc.0",
    "@angular/material": "^6.0.0-beta.5",
    "@angular/platform-browser": "^6.0.0-rc.0",
    "@angular/platform-browser-dynamic": "^6.0.0-rc.0",
    "@angular/router": "^6.0.0-rc.0",
    "core-js": "^2.5.3",
    "karma-jasmine": "^1.1.1",
    "rxjs": "^6.0.0-beta.1",
    "rxjs-compat": "^6.0.0-beta.1",
    "zone.js": "^0.8.20"
  },
  "devDependencies": {
    "@angular/cli": "^6.0.0-beta.8",
    "@angular/compiler-cli": "^6.0.0-rc.0",
    "@types/jasmine": "2.5.38",
    "@types/node": "^6.0.103",
    "codelyzer": "~2.0.0",
    "jasmine-core": "~2.5.2",
    "jasmine-spec-reporter": "~3.2.0",
    "karma": "~1.4.1",
    "karma-chrome-launcher": "~2.0.0",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^0.2.0",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "postcss-loader": "^2.1.3",
    "protractor": "~5.1.0",
    "ts-node": "~5.0.0",
    "tslint": "~5.9.1",
    "typescript": "^2.7.2"
  }
}

Then

$ ng serve
Cannot read property 'host' of null
TypeError: Cannot read property 'host' of null
    at Architect._loadJsonFile (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular-devkit\architect\src\architect.js:200:32)
    at Architect.loadArchitect (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular-devkit\architect\src\architect.js:68:45)
    at MergeMapSubscriber.workspaceLoader.loadWorkspace.pipe.operators_1.concatMap.workspace [as project] (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\models\architect-command.js:150:184)
    at MergeMapSubscriber._tryNext (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\operators\mergeMap.js:122:27)
    at MergeMapSubscriber._next (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\operators\mergeMap.js:112:18)
    at MergeMapSubscriber.Subscriber.next (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\Subscriber.js:93:18)
    at DoSubscriber._next (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\operators\tap.js:88:30)
    at DoSubscriber.Subscriber.next (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\Subscriber.js:93:18)
    at MergeMapSubscriber.notifyNext (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\operators\mergeMap.js:145:30)
    at InnerSubscriber._next (D:\dev\meetup\2018\march\view-engine\angular6\node_modules\@angular\cli\node_modules\rxjs\InnerSubscriber.js:23:21)

What can I do?

$ ng new angular-6-test
validation failed

What is validation failed?

Most helpful comment

I'm maintaining https://github.com/cexbrayat/angular-cli-diff to keep track of the changes.
For example between 1.7.3 and 6.0.0-beta.8: https://github.com/cexbrayat/angular-cli-diff/compare/1.7.3...6.0.0-beta.8 , you can see that a lot changed.

All 13 comments

Same error here!

> Angular CLI: 6.0.0-beta.8
> Node: 8.9.2
> OS: win32 x64
> Angular: 5.2.9
> ... animations, common, compiler, compiler-cli, core, forms
> ... http, language-service, platform-browser
> ... platform-browser-dynamic, router
> 
> @angular/cli: 6.0.0-beta.8
> @angular-devkit/architect: 0.0.9
> @angular-devkit/core: 0.4.8
> @angular-devkit/schematics: 0.4.8
> @ngtools/json-schema: 1.1.0
> @schematics/angular: 0.4.8
> @schematics/update: 0.4.8
> typescript: 2.5.3
> webpack: error

Manually downgraded versions in package-lock.json:

@angular-devkit/core to 0.4.6 
@angular/cli  to 6.0.0-beta.6

and now it works again, but this is a bug!

The project structure has changed! You'll need to do a diff compare on a newly generated project. The src folder has moved, files have moved.

Will this problem be solved with help ng update?

@robertbaker can you give us a link to "sample" project? or we can generate it with CLI and then compare newly generated and existing one?

you can generate a new project via CLI but you first have to update cli/@next or else it want work.
Mine was still beta6 so that didn't work.

I'm maintaining https://github.com/cexbrayat/angular-cli-diff to keep track of the changes.
For example between 1.7.3 and 6.0.0-beta.8: https://github.com/cexbrayat/angular-cli-diff/compare/1.7.3...6.0.0-beta.8 , you can see that a lot changed.

I made .angular-cli.json -> angular.json converter for my projects.
https://gist.github.com/leo6104/b4a2da0863d3c5b1877860d62464c706

  • Place this gist file ng-update-v6.js to angular project's root path
  • use command node ng-update-v6.js .angular-cli.json
  • check angular.json file (created by ng-update-v6.js)

If you want to test angular-cli >=6.0.0-beta.6, let's try this converter to create angular.json file :)

FYI the CLI team is already working on a migration script that will take care of this (see https://github.com/angular/devkit/blob/master/packages/schematics/angular/migrations/update-6/index.ts).

@cexbrayat I'm happy to hear that. 👍
But current state of the migration script not supports SSR build and many file path cases.

https://github.com/angular/devkit/blob/master/packages/schematics/angular/migrations/update-6/index.ts#L218
To build platform: server type, 'architect.build.builder' would be convert to '@angular-devkit/build-angular:server' (not @angular-devkit/build-angular:browser)

So i made the gist. @hansl Please consider platform server type app. Many of angular projects use server side rendering feature. :) If not start working on this feature yet, can i open pull request for this issue?
https://github.com/angular/devkit/compare/master...leo6104:migrate-v6

In the future, it would be nice to consider migration case

  • [ ] If asset type is JSONObject, in real use case, asset could be set to
{
  "glob": "**/*",
  "input": "../../core/config/i18n/",
  "output": "./store-i18n/"
}

https://github.com/leo6104/devkit/blob/f676642c23a18a88a6ceeb752ddf4b12d8a34a31/packages/schematics/angular/migrations/update-6/index.ts#L217
We need to consider JSONObject type.

  • [ ] asset string also can be a directory. current version only validate for a file type. In directory case, it would be better to replace asset to
{
   "glob": "**/*",
   "input": app.root + "assets",
   "output": "assets"
}
  • [ ] environment fileReplacements not exists on migration code
  • [ ] consider relative path on .angular-cli.json. path on angular.json should be replace to relative path of app.root

Getting this same error too. Is there a proposed solution or temporary fix for this?

```test-angular-app $ ng -v

_                      _                 ____ _     ___

/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _| | | | |/ _ | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ __| |_|__, |__,_|_|__,_|_| ____|_____|___|
|___/

Angular CLI: 6.0.0-beta.8
Node: 9.10.1
OS: darwin x64
Angular: 6.0.0-rc.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 6.0.0-beta.8
@angular-devkit/architect: 0.0.9
@angular-devkit/core: 0.4.8
@angular-devkit/schematics: 0.4.8
@ngtools/json-schema: 1.1.0
@schematics/angular: 0.4.8
@schematics/update: 0.4.8
typescript: 2.7.2
webpack: error
test-angular-app $ ng s
Cannot read property 'host' of null
TypeError: Cannot read property 'host' of null
at Architect._loadJsonFile (/Users//Workspace/test-angular-app/node_modules/@angular-devkit/architect/src/architect.js:200:32)
at Architect.loadArchitect (/Users/
/Workspace/test-angular-app/node_modules/@angular-devkit/architect/src/architect.js:68:45)
at MergeMapSubscriber.workspaceLoader.loadWorkspace.pipe.operators_1.concatMap.workspace [as project] (/Users//Workspace/test-angular-app/node_modules/@angular/cli/models/architect-command.js:150:184)
at MergeMapSubscriber._tryNext (/Users/
/Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/operators/mergeMap.js:122:27)
at MergeMapSubscriber._next (/Users//Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/operators/mergeMap.js:112:18)
at MergeMapSubscriber.Subscriber.next (/Users/
/Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/Subscriber.js:93:18)
at DoSubscriber._next (/Users//Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/operators/tap.js:88:30)
at DoSubscriber.Subscriber.next (/Users/
/Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/Subscriber.js:93:18)
at MergeMapSubscriber.notifyNext (/Users//Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/operators/mergeMap.js:145:30)
at InnerSubscriber._next (/Users/
/Workspace/test-angular-app/node_modules/@angular/cli/node_modules/rxjs/InnerSubscriber.js:23:21)
test-angular-app $
```

@mayordwells Wait for the release

If you want to see Angular 6.beta, you need to usage ng new .. from package angular/cli@next

My examples:
https://github.com/Angular-RU/angular-performance-example

Are you still able to reproduce this issue with the latest version?

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_This action has been performed automatically by a bot._

Was this page helpful?
0 / 5 - 0 ratings

Related issues

JanStureNielsen picture JanStureNielsen  ·  3Comments

hareeshav picture hareeshav  ·  3Comments

jmurphzyo picture jmurphzyo  ·  3Comments

hartjo picture hartjo  ·  3Comments

purushottamjha picture purushottamjha  ·  3Comments