【Angular17対応】AngularCLIをアップデートしよう！

みなさんこんにちは、現役エンジニアのサメハックです

未経験からWebエンジニアに転職し、
正社員として5年働いたのちフリーランスとして独立しました。

Angularの解説シリーズです。

今回はAngularCLIをAngular17へアップデートする方法について学んでいきましょう！

駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます！

AngularCLIをアップデートしよう！

Angular17を動かすためにはNode.jsのバージョンアップも必要となるケースが多いので
今回はNode.jsやバージョン管理ツールのアップデートも併せて行います。

アップデート前のバージョン

アップデートの流れ

Homebrewの設定＆アップデート

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
export PATH="$PATH:/opt/homebrew/bin/"
brew update

NodeBrewのアップデート

brew upgrade nodebrew

Angular17に対応したNode.jsのインストール

nodebrew install-binary v20.10.0

AngularCLIのアップデート

npm i -g @angular/cli

npm uninstall -g @angular/cli
npm cache verify
npm uninstall -g @angular/cli

npm i -g @angular/cli

バージョン確認

バージョン確認コマンド

ng v 

新規Angularアプリの作成をしよう！

新規Angularアプリ作成コマンド

ng new my-app
cd my-app
ng serve -o

暫く待つとこのようなページが表示されます。
※バージョンによりこの表示は異なります。

満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈

twitter
instagram