【Angular】Angular CLIでライブラリの追加・ビルドを行う
Angular CLI
詳細は下記記事にて。
ng add
: 外部ライブラリを追加する
ng add
を使用すると、Angularプロジェクトへの外部ライブラリの追加を行えます(複数指定可能)。
Installing packages for tooling via npm.
の文言から、結局 npm
経由でパッケージインストールしていることがわかります。
$ ng add @angular/material @angular/cdk @angular/animations Installing packages for tooling via npm.
package.json
にも依存関係が記述されていることがわかります。
$ cat package.json | grep -E "material|cdk|animations" "@angular/animations": "~7.1.0", "@angular/cdk": "~7.2.0", "@angular/material": "^7.2.0",
ng build
: アプリをビルドする
ng build
でAngularプロジェクトをビルドし、 /dist
ディレクトリ配下にビルド済みファイルを出力します。
$ ng build Date: 2018-12-24T16:20:03.523Z Hash: bb05af5cc5e75024ef83 Time: 13417ms chunk {main} main.js, main.js.map (main) 10.9 kB [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 223 kB [initial] [rendered] chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered] chunk {styles} styles.js, styles.js.map (styles) 179 kB [initial] [rendered] chunk {vendor} vendor.js, vendor.js.map (vendor) 3.69 MB [initial] [rendered] $ ls dist my-angular-app
ng update
: Angularプロジェクト及び依存ライブラリのバージョンをアップデートする
ng update
コマンドを実行すると、Angularアプリ及びアプリが依存するライブラリのバージョンをアップデートします。
$ ng update We analyzed your package.json and everything seems to be in order. Good work!