TypeScript
Firebase
bootstrap4
PWA
Angular5

Angular5、MDBootstrap、FirebaseでPWAを作ってる最中

More than 1 year has passed since last update.

Angular5でPWAを作り始めました。
ちょっとずつ、このページを更新していこうと思います。

Angularプロジェクト作成

ng new [your-project] --service-worker --style=scss

Rxjs@5.5.3が動かないバグがあるので、5.5.2にダウングレード

https://github.com/angular/angular/issues/20752

いろいろnpmインストール

アプリ作成(参考)

Building An Angular 5 Project with Bootstrap 4 and Firebase

https://medium.com/codingthesmartway-com-blog/building-an-angular-5-project-with-bootstrap-4-and-firebase-4504ff7717c1

Angular 5 Service Worker

https://medium.com/codingthesmartway-com-blog/angular-5-service-worker-b722e571e306

Material Design for Bootstrap 4 (Angular)

https://mdbootstrap.com/angular/

デプロイするモジュール作成

※Angular/cliのバグで、--aot=falseを付けないと動かない
https://github.com/angular/angular-cli/issues/8434

ng build --prod --aot=false

Firebaseにデプロイ

#ログイン。説明にないけど、--interactiveオプションを付けないと動かない
firebase login --interactive  
#dist/index.htmlディレクトリをデプロイするように設定。public/index.htmlにしないこと
firebase init
#デプロイ
firebase deploy
#ホスティングしたWebサイトをオープン
firebase open

公開完了。
作ってるサイト。

Yandle
https://yandle-d1d34.firebaseapp.com

ソース。
https://github.com/masaaki-uegaki/yandle