feat: add runtime caching for the pwa

Kamar-Meddah · Mar 24, 2018 · d651d5f · d651d5f
1 parent b9d3e14
commit d651d5f
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 13 deletions.
diff --git a/src/Components/Guest/Auth/AuthRouter.ts b/src/Components/Guest/Auth/AuthRouter.ts
@@ -1,10 +1,9 @@
-import AuthComponent from '@/Components/Guest/Auth/auth.component.vue';
 import SigninComponent from '@/Components/Guest/Auth/signin/signin.component';
 import SignupComponent from '@/Components/Guest/Auth/signup/signup.component';
 
 const AuthRoute = [{
     path: '/auth',
-    component: AuthComponent,
+    component: (resolve: any) => (require as any )(['@/Components/Guest/Auth/auth.component.vue'], resolve),
     children: [
         {
             path: 'signin',

diff --git a/src/Components/Guest/GuestRouter.ts b/src/Components/Guest/GuestRouter.ts
@@ -1,17 +1,15 @@
 import PostsRouter from './Posts/PostsRouter';
 import AuthRouter from './Auth/AuthRouter';
-import GuestComponent from '@/Components/Guest/guest.component.vue';
+
 
 const GuestRouter = [
     {
         path: '',
-        component: GuestComponent,
+        component: (resolve: any) => (require as any )(['@/Components/Guest/guest.component.vue'], resolve),
         children: [
             ...AuthRouter,
             ...PostsRouter,
         ],
     },
 ];
 export default GuestRouter;
-
-
diff --git a/src/Components/Guest/Posts/PostsRouter.ts b/src/Components/Guest/Posts/PostsRouter.ts
@@ -1,12 +1,11 @@
-import PostsComponent from '@/Components/Guest/Posts/posts.component.vue';
 import HomeComponent from '@/Components/Guest/Posts/Home/home.component';
 import PostsByCategoryComponent from '@/Components/Guest/Posts/postsByCategory/postsByCategory.component';
 import SearchComponent from '@/Components/Guest/Posts/Search/search.component';
 import ShowPostComponent from '@/Components/Guest/Posts/ShowPost/showPost.component';
 
 const PostsRoute = [{
     path: '',
-    component: PostsComponent,
+    component: (resolve: any) => (require as any )(['@/Components/Guest/Posts/posts.component.vue'], resolve),
     children: [
         {
             path: '/:page(\\d+)?',

diff --git a/src/Components/User/UserRouter.ts b/src/Components/User/UserRouter.ts
@@ -1,12 +1,11 @@
-import UserComponent from '@/Components/User/user.component.vue';
 import HomeComponent from '@/Components/User/Home/home.component';
 import SettingRouter from '@/Components/User/Setting/SettingRouter';
 import AdminRouter from '@/Components/User/admin/AdminRouter';
 
 const UserRouter = [
     {
         path: '/user',
-        component: UserComponent,
+        component: (resolve: any) => (require as any )(['@/Components/User/user.component.vue'], resolve),
         name: 'user',
         children: [
             {

diff --git a/src/Components/User/admin/AdminRouter.ts b/src/Components/User/admin/AdminRouter.ts
@@ -1,12 +1,11 @@
-import AdminComponent from '@/Components/User/admin/admin.component.vue';
 import HomeComponent from '@/Components/User/admin/home/home.component';
 import CategoriesRouter from '@/Components/User/admin/categories/CategoriesRouter';
 import PostsRouter from '@/Components/User/admin/posts/PostsRouter';
 
 const AdminRouter = [
     {
         path: 'admin',
-        component: AdminComponent,
+        component: (resolve: any) => (require as any )(['@/Components/User/admin/admin.component.vue'], resolve),
         name: 'admin',
         children: [
             {

diff --git a/tsconfig.json b/tsconfig.json
@@ -1,7 +1,7 @@
 {
   "compilerOptions": {
     "target": "es2015",
-    "module": "es2015",
+    "module": "esnext",
     "strict": true,
     "jsx": "preserve",
     "moduleResolution": "node",

diff --git a/vue.config.js b/vue.config.js
@@ -0,0 +1,43 @@
+module.exports = {
+    // ...other vue-cli plugin options...
+    pwa: {
+        workboxPluginMode: 'GenerateSW',
+        workboxOptions: {
+            "runtimeCaching": [
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/files/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: 'http://localhost:8000/Api/posts/all/',
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/posts/last/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/posts/search/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/posts/find/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/posts/lastByCatgory/*/*/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/categories/all/*'),
+                    handler: 'cacheFirst',
+                },
+                {
+                    urlPattern: new RegExp('http://localhost:8000/Api/comments/post/*'),
+                    handler: 'cacheFirst',
+                },
+
+            ]
+        },
+    },
+};