服务工作者addAll（）函数不起作用

I am trying to build a progressive web app and I want to use cache API to cache all my assets and it's not working. Whenever I check the cache file it is always empty.

Here's my code:

self.addEventListener('install', function(event) {
  console.log('[Service Worker] Installing Service Worker ...', event);
  event.waitUntil(
    caches.open('static')
      .then(function(cache) {
        console.log('[Service Worker] Precaching App Shell');
        cache.addAll([
          '/',
          'src/css/index.html',
          'src/css/app1.js',
          'src/css/fatch1.js',
          'src/css/feed1.js',
          'src/css/promise1.js',
          'src/css/material.min1.js',
          'src/css/app.css',
          'src/css/feed.css',
          'https://fonts.googleapis.com/css?family=Roboto:400,700',
          'https://fonts.googleapis.com/icon?family=Material+Icons',
          'https://cdnjs.cloudflare.com/ajax/libs/material-design-lite/1.3.0/material.indigo-pink.min.css',
          'src/images/main-image.jpg'
          ]);
      })
  )
});

self.addEventListener('activate', function(event) {
  console.log('[Service Worker] Activating Service Worker ....', event);
  return self.clients.claim();
});

self.addEventListener('fetch', function(event) {
  console.log('[Service Worker] Fetching something ....', event);
  event.respondWith(
    caches.match(event.request).
    then(function(response){
            if (response) {
                return response;
            }else{
                return fetch(event.request);
            }
     })
    );
});