Issue adding PWA features

Hey everyone!
I’m trying to add Progressive Web App (PWA) features to my website using WorkBox yarn add workbox-webpack-plugin. I followed these steps, but sadly, I’m not seeing any changes:

  • Installed workbox-webpack-plugin (yarn add workbox-webpack-plugin)
  • Created a service-worker.js file in the theme directory
  • Set up webpack.mix.js with the following code:
// resources/scripts/config.js

const { GenerateSW } = require('workbox-webpack-plugin');

module.exports = {
    // ... other configuration options

    plugins: [
        // ... other plugins

        new GenerateSW({
            swDest: 'service-worker.js',
            // ... additional configuration options
  • Registered the Service Worker using this code:
if ('serviceWorker' in navigator) {
    window.addEventListener('load', () => {
            .then((registration) => {
                console.log('Service Worker registered with scope:', registration.scope);
            .catch((error) => {
                console.error('Service Worker registration failed:', error);

The only thing I noticed is a manifest.json file created in the public directory.
Any ideas why it’s not working? What am I missing?

Sage switched from Mix to bud.js at the end of 2021

Are you working on an older site using Mix?

Thank you @ben for the heads-up about webpack.mix.js . I was following a tutorial that had it, and that caused some confusion.

Now, I’m trying Bud. Do you have any specific tutorials or resources you recommend that I follow?