Correct path for custom icon local image assets in Ionic 5

Ionic Framework Ionic Vue
1

I know this has been asked before of previous versions of the platform, but I can’t get anything to work.

Goal: store app icon assets locally so they don’t take time to load

Problem: no local asset path works–in every case, the app tries to load the /index.html into the svg image tag. I.e. the src path is not preprocessed as an asset path.

For /img/ directory under /src/, I have tried the following, all of which try to load the index.html SPA, i.e. Ionic is not processing these paths as local asset paths at all.

 addIcons({
      'home1': '/assets/img/icon.svg',
      'home2': './assets/img/icon.svg',
      'home3': 'assets/img/icon.svg',
      'home4': '@/assets/img/icon.svg',
      'home5': '../assets/img/icon.svg',
      'home6': '../../assets/img/icon.svg',
    })

External paths do work (e.g. to CDN bucket).

2

The path processing is done by the Vue CLI, not Ionic Framework. I recommend checking out this Vue CLI guide: HTML and Static Assets | Vue CLI

1 Like
3

Thank you, duh, yeah, that worked. /assets/... is the path but that folder is in /public above the /src level.

1 Like