この記事が役に立つ人
- Angularを13 -> 14に上げようとしている人（まぁ最新は15系なのだが）
- ビルドにngx-build-plusを使っている人（angular.jsonを見て確認してね）
- Yarnを使っている人
ngx-build-plus
ざっくりangular cliのwebpack設定を拡張記述できる外部ライブラリらしい。
@angular-devkit/build-angularを内包しているので、同じ使い方をしつつ、拡張的に使えるという特徴を持っている。みんな基本build-angular使ってるんじゃないかなあと思う。
Angular14に合わせてアップグレード出来ない問題
Angularを13 -> 14にあげた後に、以下コマンドでngx-build-plusも14系に上げようとした際にエラーが出た。
% yarn ng update ngx-build-plus@14 --allow-dirty
yarn run v1.22.19
$ ng update ngx-build-plus@14 --allow-dirty
The installed Angular CLI version is outdated.
Installing a temporary Angular CLI versioned 14.2.10 to perform the update.
✔ Package successfully installed.
Repository is not clean. Update changes will be mixed with pre-existing changes.
Using package manager: 'yarn'
Collecting installed dependencies...
Found 52 dependencies.
Fetching dependency metadata from registry...
Updating package.json with dependency ngx-build-plus @ "14.0.0" (was "13.0.1")...
UPDATE package.json (2327 bytes)
error @schematics/angular@15.2.4: The engine "node" is incompatible with this module. Expected version "^14.20.0 || ^16.13.0 || >=18.10.0". Got "14.19.3"
error Found incompatible module.
✖ Package install failed, see above.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
errorの内容的にはnodeのバージョンが低いよって事なのだが、これは本質ではない。
ここでnodeのバージョンを指定通りに上げても後の解決に繋がらなかった。注目すべきは@schematics/angularのバージョンにある。
このissueにもある通り、ngx-build-plusにおける@schematics/angularと@angular-devkit/build-angularの依存関係が14系以上になってしまっている為、内部的に取り込まれるこれらライブラリが現時点での最新15系となってしまって、整合性取れない感じになってるっぽい。
暫定的な対策
package.jsonでこれらライブラリのバージョンを固定してしまうのが手っ取り早かった。
以下の記述を追記して、再度アップグレードを実行すれば良さげ。
"resolutions": {
"@angular-devkit/build-angular": "14.2.10",
"@schematics/angular": "14.2.10"
}
直に15系にあげるタイミングがあると思うので、暫定対応としてこれで逃げるのもありなのかなあと思う。