We are following this guide;
We are running a bedrock + sage stack. Here are the steps we did follow:
composer require blade-ui-kit/blade-icons in bedrock root
wp acorn vendor:publish --tag=blade-icons in bedrock root
config/blade-icons.php like in the documentation
icons folder in
- Added icon set with
composer require blade-ui-kit/blade-heroicons in bedrock root
- Included icon in blade file
But after that we get following error;
Unable to locate a class or view for component [heroicon-s-menu]
Does anybody know how to fix this?
Try change the
path value to just
Thanks, this did work.
But now we are trying to use another library but we now again get the message;
Unable to locate a class or view for component [phosphor-instagram-logo-light]
We did include the library with;
composer require codeat3/blade-phosphor-icons
Do u know why the new icons are not loading?
Have you tried clearing out the cache?
wp acorn icons:cache
Thanks, but still no luck…
Did you solve this problem?
I had some problems to installing
blade-ui-kit/blade-icons package and got the same error.
- Install with
composer require blade-ui-kit/blade-icons in sage theme root folder, not bedrock root folder.
- Create folder called
config in theme root folder
wp acorn package:discover or else package config might not be detected/able to publish config-file
wp acorn vendor:publish --tag=blade-icons to publish config file to config folder.
- In config -file, uncomment everything and let path be
resources/svg and create that folder in resources (or change if you want).
bud.config.mjs add svg to assets array like this
.assets(["images","svg"]) (if you chose to create the svg -folder)
wp acorn config:clear in theme root folder.
- Add your icons/svg -files to
yarn build and
wp acorn optimize
wp acorn icons:cache
<x-icon-name_of_svg_file /> to display the icon.
Don’t know if all this is necessary but it worked for me.
And instead of installing an entire icon library now you can download individual icons from those packages and just put them in your svg-folder and save some loading time. Or if you want a entire package you could still try above steps except with that package. But first remove the
blade-ui-kit/blade-icons package as it is already included in the other packages I believe.
On using an icon kit:
When attempting to remove blade-ui-kit/blade-icons composer said that the removal failed because blade-ui-kit/blade-heroicons requires it - however, upon inspection it was actually removed and the icons seemed to work anyways. I also attempted to add it back and it still works in that case too.
wp acorn optimize &
wp acorn icons:cache do get things working
The debugger kept complaining that it couldn’t find ‘heroicons-s-document’ in the ‘default’ set. So, I assumed that it just wasn’t being picked up through the composer install. I manually added a new set for heroicons and pointed it at heroicons in the vendor directory, i doubt this is the proper way to do it, but it works.
'heroicons' => [
'path' => 'vendor/blade-ui-kit/blade-heroicons/resources/svg',
'prefix' => 'heroicon'