Bonne façon d'utiliser les ressources d'image dans Ionic 2
Quelle est la meilleure pratique pour l'image de l'actif Ionique dans les 2? J'ai un tas de SVG que je veux utiliser comme icônes non-système. J'ai trouvé quelques vieux conseils sur L'utilisation de Gulfp mais il semble que L'équipe ionique a décidé sur Rollup comme outil de construction de choix, pas de docs sur ce jusqu'à présent.
Quelqu'un m'a dit de les ajouter à www/img . Tout des inconvénients?
3 réponses
placer vos images dans www/img sonne comme un bon idéal, mais il ne fonctionnera que lorsque vous servir localement en utilisant ionic serve .
lors de la construction de votre application, le www/img sera supprimé à moins que vous ne fassiez une tâche gulfp pour copier les images à partir du dossier que vous voulez dans le dossier www/build comme montré dans ce post .
les Images utilisées dans les fichiers html doivent être dans src/assets/img (recommandé) et non dans www/assets/img (obselete). Les étiquettes d'Image ressembleraient alors à ceci:
<img src="assets/img/yourimage.jpg" alt="your image">
dans ionic 2, le dossier src/assets est destiné aux images et aux polices.
C'est ce que l'équipe ionique dit dans le guide pour modifier un projet ionique existant :
Déplacer www/img src/assets/img.
déplacer toutes les autres ressources que vous avez en www/ à la src/assets/.
[...] il semble que L'équipe ionique a décidé sur Rollup comme outil de construction de choix, pas de docs sur cette mesure.
semble comme vous demandez comment gérer les images avec la nouvelle RC.0
comme vous pouvez le voir dans conference app les images sont stockées dans src/assets/img et ensuite vous pouvez les ajouter à votre code html comme ceci:
<img src="assets/img/myImg.png">
C'est l'une des étapes mentionné dans le modifier votre projet existant guide (étape 31 pour être précis), donc je suppose que c'est ce que l'équipe ionique recommande.
@ionic / app-scripts: 3.1.8
le chemin src ci-dessous a fonctionné pour moi dans Ionic 3.( préfixé ../ avant actif)
<img src="../assets/imgs/{{item.titleID}}.svg" alt="{{item.title_desc}}">