J'utilise Vue depuis un certain temps maintenant et j'ai remarqué que je pouvais stocker des images de projet dans le dossier assets ou dans le dossier public .
Pour accéder aux images du dossier assets dans Vue, on ferait : src = "require ('@ / assets / images / myimage.jpg')"
Pour accéder aux images du dossier public dans Vue, on ferait :src="./static/images/myimage.jpg"
Quel est le bon emplacement pour stocker les images du projet Vue?
Quelle est l'implication de l'utilisation de l'un ou l'autre?
Comment affectent-ils mon projet?
3 Réponses :
Tous les éléments du dossier public sont généralement copiés directement dans votre / dist. ex: favicon.ico se retrouve dans votre dossier / dist avec le nom ... favicon.ico.
Le dossier assets est généralement l'endroit où vous placerez vos images / vidéos / fonts / svgs etc. que vous importerez dans des fichiers vue. Ces fichiers se retrouvent dans votre dossier / dist sous forme de fichier avec un nom de hachage: (ex: 5j2i35j2o251hia.png).
Les éléments du dossier / assets que vous n'importez pas explicitement ne finiront pas dans votre dossier / dist, afin de ne pas gonfler la taille finale de votre fichier.
J'espère que cela vous aidera ..
D'après la documentation officielle vue, tout ce qui se trouve dans le dossier assets sera géré par Webpack tandis que tout ce qui se trouve dans le dossier public est simplement copié mais ne passe pas par Webpack: https://cli.vuejs.org/guide/html-and-static-assets.html# gestion des actifs statiques
Donc, si vous voulez profiter des fonctionnalités d'optimisation des Webpacks pendant la construction (ce que vous voulez certainement), mettez-les dans des actifs. Je mets également toutes mes images dans le dossier des ressources et je n'ai que les images et les icônes liées à pwa dans le dossier public.
Ceci est bien expliqué.
https: //cli.vuejs .org / guide / html-and-static-assets.html # static-assets-handling
La différence entre les deux serait relative (éventuellement comme require ('image') ) par rapport aux chemins absolus. Généralement, le chemin absolu ne sera pas transmis via webpack pendant la construction. Et si vous optimisez les images du chemin absolu , rien ne se passera.