Edited at
AngularDay 13

Angular CLI の EasterEgg 他

More than 1 year has passed since last update.

この記事はAngular AdventCalendar 2017 の記事です。

Angular CLI の EasterEgg について紹介します。


Angular CLI

Angular CLI は Ember-cliをベースに作られ、webpackやテンプレートから各土台となるファイルを生成する機能や開発サーバーの起動、ビルド、テスト機能を有したAngularの開発をシンプルにする言わば全部入りのツールです。

このAngular CLIをこれまで使わないで開発をしてきたのですが、webpackのアップデートなどメインの開発とは関係がない部分で時間を取られてしまっていました。元々Angular CLIについては知っていたのですが開発の進行状況などから使えるものなのか判断しづらく使用には至っていませんでした。

しかし、公式のクイックスタートではいきなりAngular CLIのインストールから始まります。 -g がついているのでglobalへのインストールをしなければいけません。 -g をつけずにパッケージ管理すると ng new時に怒られるので注意が必要です(体験談)


globalが辛い時

WebpackはAngular CLIに内包されていますが、設定を外に出すことが出来ます。

この時、

ng new hoge

cd hoge
ng eject

を実行することで、webpackの設定を外に出した上に、angularの依存関係もバッチリpackage.jsonに出してくれます。

これで、全てをpackage.jsonで管理できるので安心です。

npm install --save-dev @angular/cli@latest

npm install --save-dev typescript

もしもうまくいかない時は上記コマンドを ng newの前に実行してみてください。


疑ってかかるAngular CLI

それでも不安なAngular CLIについて心配だったので中身を見てみることにしました。

cd $(npm root -g)/@angular/cli

で、cliがあるディレクトリに行きます。

.

├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── bin
├── commands
├── ember-cli
├── lib
├── models
├── node_modules
├── package.json
├── plugins
├── tasks
├── upgrade
└── utilities

中身はこのような構成でした。

色々と見ているとあるものを発見しました。

スクリーンショット 2017-12-13 4.41.34.png

コマンド系はこのファイルに保存されているようで、どのようにしてコマンドが呼び出されているのか確認できます。

そして見つけた easter-egg の文字。

これからAngular CLIはたくさん使っていく予定なのでせっかくだからこのEasterEggも叩いてみようと思います。


叩いた→すでにawesomeです

image.png

すでにawesomeでした。

どうやらランダムに返ってくる結果が変わるようです。


更に叩いた→Error 418

image.png

Error418というのは、 HTTPで「418 I’m a tea pot」を実装してはいけない で紹介されている Error 418 だと思われます。

Hyper Text Coffee Pot Control Protocolであって、HTTPのステータスコードではないため削除のIssueが投げられているようです。しかし、As Awesome As Can GetがどうI'm a tea pot とかかっているのか不明でした。


他にもあります。

他にもいくつかメッセージがあったので、ぜひ直接試してみてください。