Hi, thanks for the reply.

When added base=/ this param to build then images starting to show up correctly, but in this case I can't see icons, they are broken, square icons just showing there.

Just FYI, when using this npm run dev then images and icons works perfect, I didn't added or specified any param for dev.

Please help to fix it.
Thank you!!

Hi,

Apart from changing the application's base path, did you make any other modifications?

We tested this in the latest Metronic version, and with the correct base path configuration, both images and icons are displayed correctly.

Additionally, please ensure that you are loading our main icon set styles by including the following imports:

@import "assets/keenicons/duotone/style.css";
@import "assets/keenicons/outline/style.css";
@import "assets/keenicons/solid/style.css";

Hi,

Thanks for the reply.
I figured out some things, so right now my only issue is that when building the project and setting images like this

getAssetPath("media/logos/icon.png")

/build/media/logos/logo.png

/media/logos/logo.png

Just FYI, I have this in my package.json:

{
 ...
 "scripts": {
 "dev": "vite",
 "build": "vite build"
 },
 ...
}

Hi,

As you can see in our preview, all images use the base path /metronic8/vue/demo1/. This base path is configured in the vite.config.js file. Please ensure that your path is set up correctly.

Regards,
Lauris Stepanovs,
Keenthemes Support Team

Hi,

I don't have base settings in vite config or npm scripts right now, and this is what:
for dev
- images work correctly
- icons work correctly
for build
- image URLs have build prefix, so it's wrong
- icons work correctly

Then I tried adding base: '/', parameter to vite config and got this result:
for dev
- images work correctly
- icons work correctly
for build
- images work correctly
- icons are broken (shows square icon)

So the problem is in build script, to make it work correctly for both images and icons.

Maybe I don't know some config place, which can solve this issue.

If you can share what I missed or did wrong, that would be great.

Thanks in advance,
Vahan

Hi Vahan,

Do you have any errors in your browser console?

If in production mode you are getting squares instead of icons it can be due to missing font files please make sure that font files in src/assets/keenicons/duotone/style.css exist and path are correct.

Regards,
Lauris Stepanovs,
Keenthemes Support Team

Hi Lauris.

You are right, I had errors in the console (see screenshot). It was trying to load scripts with this URL: http://domain.loc/assets/Dropdown4-BUqWo6ba.js, which was not correct, files in the public/build/assets folder.

I removed the

getAssetPath

Hi,

I'm glad to hear you fixed it! Please let us know if you have any more questions on this topic or anything else.

Regards,
Lauris Stepanovs,
Keenthemes Support Team