No assets being cached.

OS: Windows 10 Pro Webpack: 3.10.0

So I'm running an SPA, which according to Lighthouse (chrome PWA plugin), is not caching any assets, either internal or external.

When I run an Lighthouise diagnostic on my test site, https://learn-redux.firebaseapp.com, I get the following report:

My webpack config file reads as:

const path = require('path');
const webpack = require('webpack');
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');
const Dotenv = require('dotenv-webpack');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const OfflinePlugin = require('offline-plugin');

module.exports = {
  devtool: 'source-map',
  context: __dirname,
  entry: {
    main: path.resolve(__dirname, './client/index'),
    vendor: [
      'react',
      'react-dom'
    ]
  },
  plugins: [
    new Dotenv({
      path: './.env',
      safe: true
    }),
    new webpack.DefinePlugin({
      'process.env': {
        'NODE_ENV': "'production'"
      }
    }),
    new webpack.optimize.UglifyJsPlugin({
      compressor: {
        warnings: false
      }
    }),
    new CleanWebpackPlugin(['public']), //Cleans webpack folder before new build
    new HtmlWebpackPlugin({
      title: 'Flamingo City',
      filename: 'index.html',
      template: './index_template.ejs',
    }),
    // See section on 'Extracting Boilerplate: https://webpack.js.org/guides/caching/
    new webpack.HashedModuleIdsPlugin(),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'vendor'
    }),
    new webpack.optimize.CommonsChunkPlugin({
      name: 'manifest'
    }),
    new CopyWebpackPlugin([
      { from: '404.html' },
      { from: 'manifest.json' },
      { from: 'images', to: 'images' },
    ]),
    new OfflinePlugin({
      publicPath: '/',
      safeToUseOptionalCaches: true,
      caches: {
        main: [
          'main-*.js',
          'vendor-*.js',
          'manifest-*.js',
          'index.html',
          'images/*.png'
        ],
        additional: [
          ':externals:'
        ],
        optional: [
          ':rest:'
        ]
      },
      externals: [
        '/',
        'https://scontent.cdninstagram.com',
        'https://rawgit.com'
      ],
      ServiceWorker: {
        navigateFallbackURL: '/',
        events: true
      },
      AppCache: {
        FALLBACK: {
          '/': '/offline-page.html'
        },
        events: true
      }
    })
  ],
  output: {
    path: path.join(__dirname, '/public'),
    filename: '[name]-[chunkhash].js',
    publicPath: '/'
  },
  module: {
    rules: [
    // js
    {
      test: /\.js$/,
      use: ['babel-loader'],
      include: path.join(__dirname, 'client')
    },
    // CSS
    { 
      test: /\.styl$/, 
      include: path.join(__dirname, 'client'),
      use: [
        'style-loader',
        'css-loader',
        'stylus-loader'
      ]
    },
    // sCSS
    { 
      test: /\.scss$/, 
      include: path.join(__dirname, 'client'),
      use: [
        'style-loader',
        'css-loader',
        'sass-loader'
      ]
    }
    ]
  }
};

and my build file structure is as follows:

and images structure:

What am I overlooking here?

On further inspection, the following errors are being generated in console:

How do I address this?

'https://scontent.cdninstagram.com', 'https://rawgit.com'

It doesn't handle dynamic URLs, it accepts exact URLs. In your case you're trying to cache 'https://rawgit.com' main page and 'https://scontent.cdninstagram.com' main page.

@NekR Even when I specify an exact url, as follows:

      externals: [
        '/',
        'https://rawgit.com/milktronics/beaglegr.am/master/public/fonts/billabong-webfont.woff'
      ],

still Lighthouse indicates that the object has not been cached.

Those URLs you're trying to cache should have CORS headers implemented, otherwise it won't be cached (an error would happen as on your screenshot).

@NekR

It doesn't handle dynamic URLs

Are there any plans to implement this?

Well, there are plans, but no time for it.