Question about adding a JavaScript plugin

[jengalas]

• This is a question about using the theme.
• I am using the latest version of the theme.
• I have updated all gems with bundle update.
• I have tested locally with bundle exec jekyll build.

---

Environment informations

• Minimal Mistakes version: 4.9.0
• Jekyll version: 3.7.0
• GitHub Pages hosted: yes (but only building locally for now)
• Operating system: Windows 10

---

Expected behavior

I am upgrading from an old version to the gem-based version of the theme now that Github Pages supports it. Everything seems to be fine except I'm having trouble adding a plugin.

I have added the file to assets/js/plugins, and added the path to package.json as specified here: https://mmistakes.github.io/minimal-mistakes/docs/javascript/ This was pretty much the same as I did with the old version of the theme.

But when I run npm run build:js I get the error ERROR: can't read file: assets/js/vendor/jquery/jquery-3.2.1.min.js Do I need to have a local copy of the theme's JS files for Node to see them?

[mmistakes]

Yes, the npm run script isn't aware of the assets coming from Jekyll or the ruby gem.

If you want to build your own local version of main.min.js using that script you need to copy the entire contents of /assets/js from this repo to your local site. Then run npm run build:js to generate that file... which should then be able to override what comes in the theme.

The other option... and possibly less performant since the scripts won't be concatenated is to use the footer_scripts array in your _config.yml.

This way you can just drop in your custom JS into /assets/jsand then reference it without needing to build the main.min.js file.

footer_scripts:
  - /assets/js/your-custom-footer-script.js

The only gotcha here is you using this requires you to list out all of the scripts the theme uses by default because it disables main.min.js.

It would end up being something like:

footer_scripts:
  - /assets/js/vendor/jquery/jquery-3.2.1.min.js
  - /assets/js/plugins/jquery.fitvids.js
  - /assets/js/plugins/jquery.greedy-navigation.js
  - /assets/js/plugins/jquery.magnific-popup.js
  - /assets/js/plugins/jquery.smooth-scroll.min.js
  - /assets/js/plugins/_main.js
  - /assets/js/your-custom-footer-script.js

[jengalas]

Thank you! I think I'm still missing something. Jekyll doesn't seem to be able to see anything I add to the assets/js folder - just the files coming from the remote theme. If I go to http://localhost:4000/assets/js/plugins/ in my browser I see the files from the theme, but not the one I have added, although I can see it in the proper folder in Windows Explorer.

[mmistakes]

Hmmm, not sure what's going on for you. I just created a test repo that uses the remote theme and it worked perfectly fine for me.

In my test repo I created /assets/js/my-test-script.js, ran jekyll build

... and as expected Jekyll created my-test-script.js inside the compiled _site folder.

[jengalas]

@mmistakes Thank you. I'm trying again (from the beginning) but now I'm running into the error jekyll 3.6.2 | Error: Peer certificate cannot be authenticated with given CA certificates when running bundle exec jekyll serve (or build).

It looks like you had the same problem here: benbalter/jekyll-remote-theme#9

Were you able to resolve it?

[mmistakes]

No I never figured it out. I only use Windows for testing so I gave up trying to get the remote theme gem to work there since my primary computer is macOS based.

Might be worth adding to that issue as I assumed it was some weird bug only I was hitting.

[jengalas]

Will do, thanks!