【障害メモ】[Angular CLI]Invalid rule result: Instance of class Promise.

発生した障害
障害が発生した環境
障害の改修手順
- Angular CLIの最新版をインストール
- Node.jsのバージョン10.9以上をインストール
動作確認
参考サイト

発生した障害

Angular v8のプロジェクトでAngular CLIのng generateコマンドを使用してコンポーネントを作成しようとしたら、Invalid rule result: Instance of class Promise.というエラーメッセージが表示された。

$ ng g component component/forder-list-header
Invalid rule result: Instance of class Promise.

障害が発生した環境

$ ng version

Angular CLI: 7.3.6
Node: 8.11.3
OS: darwin x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.20
@angular-devkit/build-angular     0.12.4
@angular-devkit/build-optimizer   0.12.4
@angular-devkit/build-webpack     0.12.4
@angular-devkit/core              8.3.20
@angular-devkit/schematics        8.3.20
@angular/cdk                      7.3.7
@angular/cli                      8.3.20
@angular/fire                     5.2.3
@angular/material                 7.3.7
@ngtools/webpack                  7.2.4
@schematics/angular               8.3.20
@schematics/update                0.803.20
rxjs                              6.5.3
typescript                        3.5.3
webpack                           4.28.4

障害の改修手順

下記の二つのステップを通じて障害を改修した。

Angular CLIの最新版をインストール
Node.jsのバージョン10.9以上をインストール

Angular CLIの最新版をインストール

まず、Angular CLI(@angular/cli)の最新版のnpmパッケージをグローバルインストールする。

$ npm install @angular/cli -g

/usr/local/bin/ng -> /usr/local/lib/node_modules/@angular/cli/bin/ng

> @angular/cli@8.3.20 postinstall /usr/local/lib/node_modules/@angular/cli
> node ./bin/postinstall/script.js

+ @angular/cli@8.3.20
added 83 packages, removed 196 packages, updated 61 packages and moved 2 packages in 12.383s
(base) MacBook-Pro-4:concept takuya$ 
(base) MacBook-Pro-4:concept takuya$ ng g component component/forder-list-header
You are running version v8.11.3 of Node.js, which is not supported by Angular CLI 8.0+.
The official Node.js version that is supported is 10.9 or greater.

Please visit https://nodejs.org/en/ to find instructions on how to update Node.js.
(base) MacBook-Pro-4:concept takuya$ ng g component component/forder-list-header
You are running version v8.11.3 of Node.js, which is not supported by Angular CLI 8.0+.
The official Node.js version that is supported is 10.9 or greater.

Please visit https://nodejs.org/en/ to find instructions on how to update Node.js.

Node.jsのバージョン10.9以上をインストール

Angular CLIのインストールを実施すると上記の通り、「Node.jsのバージョンを10.9以上にしなさいと」いうメッセージが表示されるので、続いてNode.jsのインストールを実施する。

過去のTypeScript/JavaScriptのプロジェクトが動かなくなったら困るので、Node.jsのバージョン管理ツールであるnを使ってNodeのアップグレードを実施する。

まず、npm install n -gコマンドでnのグローバルインストールを実施。

$ npm install n -g

n --stableとn --latestコマンドで安定版と最新版のバージョンを確認

$ n --stable
12.13.1
(base) MacBook-Pro-4:concept takuya$ n --latest
13.3.0

安定版でバージョンの条件を十分満たしていたので、n stableコマンドで安定版の方のNodeをインストールする

$ n stable

node --versionコマンドでNodeのバージョンを確認すると、正常に安定版のバージョンがインストールされていることがわかる。

$ node --version
v12.13.1

動作確認

上記の手順を踏んだ後でng generateコマンドを実行すると、正常に処理が完了してコンポーネントも作成された。

$ ng g component component/forder-list-header
CREATE src/app/component/forder-list-header/forder-list-header.component.scss (0 bytes)
CREATE src/app/component/forder-list-header/forder-list-header.component.html (33 bytes)
CREATE src/app/component/forder-list-header/forder-list-header.component.spec.ts (700 bytes)
CREATE src/app/component/forder-list-header/forder-list-header.component.ts (316 bytes)
UPDATE src/app/app.module.ts (3872 bytes)