はじめに
これは Angular Advent Calendar 2024 8 日目を代わりに投稿した記事です。
新規で Angular プロジェクトを作るときのコマンドは?
突然だが、新規で Angular のプロジェクトを作るときどんなコマンドを実行するだろうか?公式ドキュメントを見ると次の手順が案内されている。
npm install -g @angular/cli ng new <project-name>
まず、Angular CLI をグローバルインストールし、これによって使えるようになる ng
コマンドでプロジェクトを作るというステップである。
しかし、個人的にはなんでもグローバルにインストールすることに抵抗がある。 あくまで not for me なだけだが、同じように考える人は少なくないのではないだろうか?
代替案として下記を使っていたこともある。
npx @angular/cli@latest new <project-name>
しかし、そんな回りくどい方法を取らなくても公式が提供する @angular/create
を使うことで簡単に作成できるので、今回はそちらを紹介する。
@angular/create
とは
angular-cli/packages/angular/create/README.md at 19.0.6 · angular/angular-cli · GitHub
ドキュメントを見ると Angular CLI をグローバルにインストールすることなく、Angular CLI ワークスペースを作ると書いてある。つまりこれが本当に欲しかったものである。
使い方もドキュメントに書いてあるとおりで、次のコマンドを実行するだけでよい。
npm init @angular@latest <project-name>
さらに @angular/create
は npm だけでなく yarn や pnpm, bun にまで対応している。どの環境でも手軽に始められることがわかる。
npm のときだけ init
を使うようにドキュメントには書かれているがエイリアスが用意されているため、他のパッケージマネージャーと同様に create
を使っても問題なく動作する。
npm-init について
気づいた方もいるかも知れないが、npm init xxx
または npm create xxx
というインストール手順は Angular だけのものではない。
これは npm-init という仕組みの上で成り立っている。npm-init については公式ドキュメントを読むほうが早いので、そちらに譲ることとする。
この仕組みの上で動作するための @angular/create
がちゃんと公式から提供されているというお話である。
さいごに
このパッケージがリリースされたのは実は 2 年も前である。
yarn create @angular new-app [...options]
— Angular (@angular) 2022年7月26日
or
npm init @angular new-app -- [...options]
しかし、公式ドキュメントからたどり着くのが難しいためここで紹介してみた。 新しく v19 で Angular アプリケーションを作ってみようと思っている人はぜひ使ってみてはいかがだろうか?