Converted app to PWA

4 年之前 · 9646947a5b
--- a/angular.json
+++ b/angular.json
@@ -29,7 +29,8 @@
                "glob": "**/*.svg",
                "input": "node_modules/ionicons/dist/ionicons/svg",
                "output": "./svg"
              }
              },
              "src/manifest.webmanifest"
            ],
            "styles": [
              {
@@ -64,7 +65,9 @@
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                }
              ]
              ],
              "serviceWorker": true,
              "ngswConfigPath": "ngsw-config.json"
            },
            "ci": {
              "progress": false
@@ -110,7 +113,8 @@
                "glob": "**/*",
                "input": "src/assets",
                "output": "/assets"
              }
              },
              "src/manifest.webmanifest"
            ]
          },
          "configurations": {
--- a/ngsw-config.json
+++ b/ngsw-config.json
@@ -0,0 +1,30 @@
 {
  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/manifest.webmanifest",
          "/*.css",
          "/*.js"
        ]
      }
    },
    {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ]
 }
--- a/package-lock.json
+++ b/package-lock.json
@@ -438,6 +438,14 @@
        "tslib": "^2.0.0"
      }
    },
    "@angular/service-worker": {
      "version": "10.0.14",
      "resolved": "https://registry.npmjs.org/@angular/service-worker/-/service-worker-10.0.14.tgz",
      "integrity": "sha512-/oXyXRC+LFuKACcItG7EJaHe0D24x6KIyh3jg1TkClqWQe0rfVtvcYq+Fday69+gdZOM6euMWjBMoJqXJP7PcA==",
      "requires": {
        "tslib": "^2.0.0"
      }
    },
    "@babel/code-frame": {
      "version": "7.12.11",
      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.12.11.tgz",
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
    "@angular/platform-browser": "~10.0.0",
    "@angular/platform-browser-dynamic": "~10.0.0",
    "@angular/router": "~10.0.0",
    "@angular/service-worker": "~10.0.0",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -8,11 +8,13 @@ import { StatusBar } from '@ionic-native/status-bar/ngx';

 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { ServiceWorkerModule } from '@angular/service-worker';
 import { environment } from '../environments/environment';

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production })],
  providers: [
    StatusBar,
    SplashScreen,
--- a/src/assets/icons/icon-128x128.png
+++ b/src/assets/icons/icon-128x128.png
--- a/src/assets/icons/icon-144x144.png
+++ b/src/assets/icons/icon-144x144.png
--- a/src/assets/icons/icon-152x152.png
+++ b/src/assets/icons/icon-152x152.png
--- a/src/assets/icons/icon-192x192.png
+++ b/src/assets/icons/icon-192x192.png
--- a/src/assets/icons/icon-384x384.png
+++ b/src/assets/icons/icon-384x384.png
--- a/src/assets/icons/icon-512x512.png
+++ b/src/assets/icons/icon-512x512.png
--- a/src/assets/icons/icon-72x72.png
+++ b/src/assets/icons/icon-72x72.png
--- a/src/assets/icons/icon-96x96.png
+++ b/src/assets/icons/icon-96x96.png
--- a/src/assets/icons/logo-128-128.png
+++ b/src/assets/icons/logo-128-128.png
--- a/src/assets/icons/logo-144-144.png
+++ b/src/assets/icons/logo-144-144.png
--- a/src/assets/icons/logo-192-192.png
+++ b/src/assets/icons/logo-192-192.png
--- a/src/assets/icons/logo-48-48.png
+++ b/src/assets/icons/logo-48-48.png
--- a/src/assets/icons/logo-512-512.png
+++ b/src/assets/icons/logo-512-512.png
--- a/src/assets/icons/logo-72-72.png
+++ b/src/assets/icons/logo-72-72.png
--- a/src/assets/icons/logo-96-96.png
+++ b/src/assets/icons/logo-96-96.png
--- a/src/index.html
+++ b/src/index.html
@@ -2,25 +2,28 @@
 <html lang="en">

 <head>
  <meta charset="utf-8" />
  <title>Ionic App</title>
  <meta charset="utf-8"/>
  <title> KXIP App </title>

  <base href="/" />
  <base href="/"/>

  <meta name="color-scheme" content="light dark" />
  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
  <meta name="format-detection" content="telephone=no" />
  <meta name="msapplication-tap-highlight" content="no" />
  <meta name="color-scheme" content="light dark"/>
  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
  <meta name="format-detection" content="telephone=no"/>
  <meta name="msapplication-tap-highlight" content="no"/>

  <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
  <link rel="icon" type="image/png" href="assets/icon/favicon.png"/>

  <!-- add to homescreen for ios -->
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
  <meta name="apple-mobile-web-app-capable" content="yes"/>
  <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
  <link rel="manifest" href="manifest.webmanifest">
  <meta name="theme-color" content="#ED1C24">
 </head>

 <body>
  <app-root></app-root>
  <noscript>Please enable JavaScript to continue using this application.</noscript>
 </body>

 </html>
--- a/src/manifest.webmanifest
+++ b/src/manifest.webmanifest
@@ -0,0 +1,59 @@
 {
  "name": "KXIP",
  "short_name": "KXIP",
  "theme_color": "#ED1C24",
  "background_color": "#fafafa",
  "display": "fullscreen",
  "scope": "./",
  "start_url": "./",
  "icons": [
    {
        "src": "assets/icons/logo-48-48.png",
        "sizes": "48x48",
        "type": "image/png",
        "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-72-72.png",
      "sizes": "72x72",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-96-96.png",
      "sizes": "96x96",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-128-128.png",
      "sizes": "128x128",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-144-144.png",
      "sizes": "144x144",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-152-152.png",
      "sizes": "152x152",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-192-192.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable any"
    },
    {
      "src": "assets/icons/logo-512-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable any"
    }
  ]
 }