Sage 9 - Using composer to require a modified bootstrap 4 navwalker

Hi all,

I wanted to use a modified version of @MWDelaney’s Bootstrap 4 navwalker. I didn’t change much, as you can see here. Basically, all I wanted to do was make the parent link clickable and have the dropdown show on a hover event rather than on a click event.

So, I made that fork, then I tried to change the composer.json file in my theme directory from:

{
  "name": "roots/sage",
  "type": "wordpress-theme",
  "license": "MIT",
  "description": "WordPress starter theme with a modern development workflow",
  "homepage": "https://roots.io/sage/",
  "authors": [
    {
      "name": "Ben Word",
      "email": "ben@benword.com",
      "homepage": "https://github.com/retlehs"
    },
    {
      "name": "Scott Walkinshaw",
      "email": "scott.walkinshaw@gmail.com",
      "homepage": "https://github.com/swalkinshaw"
    },
    {
      "name": "QWp6t",
      "email": "hi@qwp6t.me",
      "homepage": "https://github.com/qwp6t"
    }
  ],
  "keywords": ["wordpress"],
  "support": {
    "issues": "https://github.com/roots/sage/issues",
    "forum": "https://discourse.roots.io/"
  },
  "autoload": {
    "psr-4": {
      "App\\": "app/"
    }
  },
  "require": {
    "php": ">=7",
    "composer/installers": "~1.0",
    "illuminate/support": "~5.4",
    "roots/sage-lib": "~9.0.0-beta.4",
    "soberwp/controller": "~9.0.0-beta.4",
    "mwdelaney/sage-bootstrap4-navwalker": "^1.1"
  },
  "require-dev": {
    "squizlabs/php_codesniffer": "^2.8.0",
    "roots/sage-installer": "~1.3"
  },
  "scripts": {
    "test": ["phpcs"],
    "post-create-project-cmd": [
      "Roots\\Sage\\Installer\\ComposerScript::postCreateProject"
    ]
  }
}

To:

{
  "name": "roots/sage",
  "type": "wordpress-theme",
  "license": "MIT",
  "description": "WordPress starter theme with a modern development workflow",
  "homepage": "https://roots.io/sage/",
  "authors": [
    {
      "name": "Ben Word",
      "email": "ben@benword.com",
      "homepage": "https://github.com/retlehs"
    },
    {
      "name": "Scott Walkinshaw",
      "email": "scott.walkinshaw@gmail.com",
      "homepage": "https://github.com/swalkinshaw"
    },
    {
      "name": "QWp6t",
      "email": "hi@qwp6t.me",
      "homepage": "https://github.com/qwp6t"
    }
  ],
  "keywords": ["wordpress"],
  "support": {
    "issues": "https://github.com/roots/sage/issues",
    "forum": "https://discourse.roots.io/"
  },
  "autoload": {
    "psr-4": {
      "App\\": "app/"
    }
  },
  "repositories": [
    {
      "type": "package",
      "package": {
        "name": "broskees/sage-bootstrap4-navwalker",
        "version": "master",
        "type": "wordpress-plugin",
        "source": {
          "url": "https://github.com/broskees/sage-bootstrap4-navwalker.git",
          "type": "git",
          "reference": "master"
        }
      }
    }
  ],
  "require": {
    "php": ">=7",
    "composer/installers": "~1.0",
    "illuminate/support": "~5.4",
    "roots/sage-lib": "~9.0.0-beta.4",
    "soberwp/controller": "~9.0.0-beta.4",
    "broskees/sage-bootstrap4-navwalker": "dev-master"
  },
  "require-dev": {
    "squizlabs/php_codesniffer": "^2.8.0",
    "roots/sage-installer": "~1.3"
  },
  "scripts": {
    "test": ["phpcs"],
    "post-create-project-cmd": [
      "Roots\\Sage\\Installer\\ComposerScript::postCreateProject"
    ]
  }
}

Anyways, I’m getting the following error:
Class 'App\wp_bootstrap4_navwalker' not found in /srv/www/syracusesedationandfamilydentistry.com/current/web/app/uploads/cache/49eb2974a162cc0ddc7026f69fa7c7f4b7120bc5.php on line 14 (Which is where I call the navwalker in my header.blade.php file.

I thought it has something to do with me not understanding what these lines do. (Sage introduced me to composer, still learning as I go)

  "autoload": {
    "psr-4": {
      "App\\": "app/"
    }
  },

But after reading about composer autoloading, I see that just adds the App namespace with a single line of code.

TLDR: I think my issue is I need to add the new navwalker to the App namespace. How can I do that?

Now I know that this is probably out of the scope of support here, but maybe it isn’t? Anyways help is appreciated.

Did you type composer install after changing your composer.json file? If so, did it give you any errors?

I did. No errors. Here’s an update though:

For whatever reason, when I use your repository it puts your script in theme-dir/vendor/mwdelaney/sage-bootstrap4-navwalker, however, when I use my repository it puts it in theme-dir/wp-content/plugins/sage-bootstrap4-navwalker. Super weird.

I am using bedrock, which is seemingly the behavior for plugins required in that composer.json file.

Ah. Yes. Mine isn’t a plugin, it’s a support class for Sage. I think if you adjust your repositories entry you can make yours work the same way.

That worked to move it correctly in the vendor directory.

Specifically just removing the "type": "wordpress-plugin", line.

Still throwing the same error though :confused:

I’m gonna guess that you didn’t regenerate the autoloader after renaming things.

In your vendor/sage-bootstrap4-navwalker directory type composer dumpautoload. If that works, do that in your GitHub repo and commit the results.

Tried that, also tried running composer clearcache because it was loading an older version. It successfully updated it, but it’s still giving me errors.

Also restarted vagrant and browsersync. No avail.

Is it possible that it could be due to some server-side caching along the way? Or perhaps I have to re-provision my local vagrant box?

EDIT: Tried reprovisioning, no dice. Thoughts?

Could still use help here if anyone is privey

Could you try simply including the navwalker with PHP rather than with composer for troubleshooting? Then you can determine whether the issue is with the navwalker code, or with composer’s autoloading.

Figured it out!

I had to add the autoload bit to the composer file. Like so:

  "repositories": [
    {
      "type": "package",
      "package": {
        "name": "broskees/sage-bootstrap4-navwalker",
        "version": "master",
        "source": {
          "url": "https://github.com/broskees/sage-bootstrap4-navwalker.git",
          "type": "git",
          "reference": "master"
        },
        "autoload": {
          "files": ["bootstrap4-navwalker.php"]
        }
      }
    }
  ],