javascript - Problème de chemin vue-lazyload

Question

Posez une question :

目录
__ src
  |_ assets
     |_imgs
        |_ imgloading.gif
        |_ imgerror.jpg
__ static
  |_ imgloading.gif
  |_ imgerror.jpg

// src/main.js
Vue.use(VueLazyload, {
  error: './assets/imgs/imgerror.jpg',
  loading: './assets/imgs/imgloading.gif',
  preLoad: 1,
  attempt: 1
});

Executionnpm run dev在浏览器中报错http://localhost:8080/assets/images/.... 找不到，把上面的路径改成/src/assets/imgs/imgerror.jpg signale également une erreur.
Puis j'ai mis l'image sous le dossier static au même niveau que src, et j'ai réécrit le code :

// src/main.js
Vue.use(VueLazyload, {
  error: '../static/imgerror.jpg',
  loading: '../static/imgloading.gif',
  preLoad: 1,
  attempt: 1
});

L’image peut être chargée avec succès. Je pensais que je n’en avais pas la moindre idée depuis longtemps.

Answer 1

./assets/imgs/imgerror.jpg Il semble qu'il n'y ait pas de dossier imgs dans votre répertoire

Answer 2

Il est dit que le chemin dans le modèle sera analysé par webpack, tandis que le chemin dans js doit être référencé via l'importation, exiger ou mettre l'image sous statique pour référence

Answer 3

require('./assets/imgs/imgerror.jpg')